Update demo to vue 2.2.0 and fix delete node error

This commit is contained in:
weibangtuo 2017-04-26 11:13:54 +08:00
parent 26e0197365
commit ee3d9a975f
5 changed files with 7 additions and 26 deletions

View File

@ -1,6 +1,6 @@
# Vue Tree View Component
Support `Vue.js` 1.0+
Support `Vue.js` 2.0+
## Usage

View File

@ -1,19 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue Tree</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<link rel="stylesheet" href="../src/tree.vue.css">
</head>
<body>
<div id="demo">
<h1>{{title}}</h1>
<vue-tree :option="option"></vue-tree>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.21/vue.js"></script>
<script src="../src/tree.vue.js"></script>
<script src="demo.js"></script>
</body>
</html>

View File

@ -12,7 +12,7 @@
<vue-tree :option="option"></vue-tree>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.0/vue.min.js"></script>
<script src="../src/tree.vue.js"></script>
<script src="demo.js"></script>
</body>

View File

@ -3,7 +3,7 @@
var addNode = function (node) {
node.isOpen = true;
node.children.push({
name: 'child node',
name: 'child node ' + node.children.length,
parent: node,
isParent: true,
children: [],
@ -16,7 +16,7 @@
title: 'Delete',
icon: 'fa fa-trash',
click: function (node) {
node.parent && node.parent.children.$remove(node);
node.parent.children.splice(node.parent.children.indexOf(node), 1);
}
}
]
@ -86,14 +86,14 @@
click: function (node) {
node.isOpen = true;
node.children.push({
name: 'Level2 node',
name: 'Level2 node ' + node.children.length,
parent: node,
buttons: [
{
title: 'Delete',
icon: 'fa fa-trash',
click: function (node) {
node.parent.children.$remove(node);
node.parent.children.splice(node.parent.children.indexOf(node), 1);
}
}
]

View File

@ -8,7 +8,7 @@
'<a v-for="btn in node.buttons" class="ml5" href="javascript:" :title="btn.title" v-on:click="btnClick(btn, node)"><i :class="btn.icon"></i></a>' +
'<ul v-show="node.isOpen">' +
'<li v-show="node.showLoading && node._loading"><i class="fa fa-spinner fa-pulse"></i></li>' +
'<vue-tree-item v-for="item in node.children" :node="item"></vue-tree-item>' +
'<vue-tree-item v-for="item in node.children" :node="item" v-key="node.id"></vue-tree-item>' +
'</ul>' +
'</li>',
props: {