我在脚本标签下的 .html 文件中尝试了 jsplumb 脚本。这工作正常。
<body>
<div id="q-app"></div>
<!-- built files will be auto injected -->
<script>
jsPlumb.ready(function() {
jsPlumb.connect({
source:"item_left",
target:"item_right",
endpoint:"Rectangle"
});
jsPlumb.draggable("item_left");
jsPlumb.draggable("item_right");
});
</script>
</body>
但是现在我想将此 jsplumb 代码/脚本集成到 .vue 文件中。我尝试将此脚本放在 .vue 文件中的脚本标记下，但除了一个零错误的空白页面外，我没有得到任何输出。我怎样才能继续？。用一些简单的例子来指导我。
小智 2
你可以试试这个：
mydraggableview.vue
<template>
<div id="diagramContainer">
<div id="item_left" class="item"></div>
<div id="item_right" class="item" style="margin-left:50px;"></div>
</div>
</template>
<script>
import jsplumb from 'jsplumb'
export default {
props: ['yourProps'],
data() {
return {
your: data
}
},
mounted(){
jsPlumb.ready(function() {
jsPlumb.connect({
source:"item_left",
target:"item_right",
endpoint:"Rectangle"
})
})
}
}
</script>
然后你可以导入你要使用它的地方。
其他文件.js
<script>
import myDraggableComponent from './path/to/component/mydraggableview'
</script>
并将其用作指令或在组件内部使用。
| 归档时间： |
|
| 查看次数： |
2431 次 |
| 最近记录： |