JTopo在vue中双击图片弹出编辑框

最新推荐文章于 2024-12-01 01:40:08 发布

Seven_5477

最新推荐文章于 2024-12-01 01:40:08 发布

阅读量760

点赞数

CC 4.0 BY-SA版权

分类专栏： Vue 文章标签： vue javascript 前端

本文链接：https://blog.youkuaiyun.com/m0_37922443/article/details/121474630

JTopo官网有一个编辑框案例：jTopo Demo

编辑框写的位置如下：（此处我换成我需要的input元素，而非源码中的textarea）

<template id="template-mesh_topology">
        <div>
            <div class="advanceContent">
                <canvas width="600" height="800" id="canvas"
                    style="background-color: rgb(128, 128, 128); border: 1px solid rgb(68, 68, 68); cursor: default;">
                </canvas>
            </div>
            <div id="jtopo_textfield" class="control-input"
                style="background: #fff;position: absolute; top: 494px; left: 719px; display: none;">
                <input id="jtopo_input" class="input-txt" type="text" :disabled="disable_set==1"
                    @keydown="if(event.keyCode==13)this.blur();">
            </div>
        </div>
    </template>

双击弹出编辑框，编辑框焦点移开后隐藏编