Compare commits
2 Commits
Author | SHA1 | Date | |
---|---|---|---|
![]() |
d1e12aad85 | ||
![]() |
d5dd9b88c9 |
17
dev/App.vue
17
dev/App.vue
@@ -31,7 +31,12 @@
|
|||||||
</template>
|
</template>
|
||||||
<template v-slot:treeNodeIcon="slotProps">
|
<template v-slot:treeNodeIcon="slotProps">
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
{{ (slotProps.model.children && slotProps.model.children.length > 0 && !slotProps.expanded) ? '🌲' : '' }}</span>
|
{{
|
||||||
|
slotProps.model.children && slotProps.model.children.length > 0 && !slotProps.expanded
|
||||||
|
? '🌲'
|
||||||
|
: ''
|
||||||
|
}}</span
|
||||||
|
>
|
||||||
</template>
|
</template>
|
||||||
</vue-tree-list>
|
</vue-tree-list>
|
||||||
<button @click="getNewTree">Get new tree</button>
|
<button @click="getNewTree">Get new tree</button>
|
||||||
@@ -42,7 +47,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import {VueTreeList, Tree, TreeNode} from '../src'
|
import { VueTreeList, Tree, TreeNode } from '../src'
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
VueTreeList
|
VueTreeList
|
||||||
@@ -105,23 +110,23 @@ export default {
|
|||||||
console.log(params)
|
console.log(params)
|
||||||
},
|
},
|
||||||
|
|
||||||
drop: function({node, src, target}) {
|
drop: function({ node, src, target }) {
|
||||||
// eslint-disable-next-line no-console
|
// eslint-disable-next-line no-console
|
||||||
console.log('drop', node, src, target)
|
console.log('drop', node, src, target)
|
||||||
},
|
},
|
||||||
|
|
||||||
dropBefore: function({node, src, target}) {
|
dropBefore: function({ node, src, target }) {
|
||||||
// eslint-disable-next-line no-console
|
// eslint-disable-next-line no-console
|
||||||
console.log('drop-before', node, src, target)
|
console.log('drop-before', node, src, target)
|
||||||
},
|
},
|
||||||
|
|
||||||
dropAfter: function({node, src, target}) {
|
dropAfter: function({ node, src, target }) {
|
||||||
// eslint-disable-next-line no-console
|
// eslint-disable-next-line no-console
|
||||||
console.log('drop-after', node, src, target)
|
console.log('drop-after', node, src, target)
|
||||||
},
|
},
|
||||||
|
|
||||||
addNode() {
|
addNode() {
|
||||||
var node = new TreeNode({name: 'new node', isLeaf: false})
|
var node = new TreeNode({ name: 'new node', isLeaf: false })
|
||||||
if (!this.data.children) this.data.children = []
|
if (!this.data.children) this.data.children = []
|
||||||
this.data.addChildren(node)
|
this.data.addChildren(node)
|
||||||
},
|
},
|
||||||
|
2
package-lock.json
generated
2
package-lock.json
generated
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "vue-tree-list",
|
"name": "vue-tree-list",
|
||||||
"version": "1.4.4",
|
"version": "1.4.5",
|
||||||
"lockfileVersion": 1,
|
"lockfileVersion": 1,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "vue-tree-list",
|
"name": "vue-tree-list",
|
||||||
"version": "1.4.4",
|
"version": "1.4.5",
|
||||||
"description": "A vue component for tree structure. Support adding treenode/leafnode, editing node's name and dragging.",
|
"description": "A vue component for tree structure. Support adding treenode/leafnode, editing node's name and dragging.",
|
||||||
"author": "ayou",
|
"author": "ayou",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@@ -221,7 +221,8 @@ export default {
|
|||||||
this.rootNode.$emit('change-name', {
|
this.rootNode.$emit('change-name', {
|
||||||
id: this.model.id,
|
id: this.model.id,
|
||||||
oldName: oldName,
|
oldName: oldName,
|
||||||
newName: e.target.value
|
newName: e.target.value,
|
||||||
|
node: this.model
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -295,6 +296,7 @@ export default {
|
|||||||
return true
|
return true
|
||||||
},
|
},
|
||||||
dragEnter() {
|
dragEnter() {
|
||||||
|
if (!compInOperation) return
|
||||||
if (compInOperation.model.id === this.model.id || !compInOperation || this.model.isLeaf)
|
if (compInOperation.model.id === this.model.id || !compInOperation || this.model.isLeaf)
|
||||||
return
|
return
|
||||||
this.isDragEnterNode = true
|
this.isDragEnterNode = true
|
||||||
|
Reference in New Issue
Block a user