modify vue-tree to vue-tree-list

This commit is contained in:
ayou
2017-07-23 10:56:16 +08:00
parent 1c253ddec9
commit f71a5b3030
7 changed files with 26 additions and 26 deletions

File diff suppressed because one or more lines are too long

View File

@@ -78,7 +78,7 @@
</span> </span>
New Treenode New Treenode
</button> </button>
<vue-tree :model="data" default-tree-node-name="new node" default-leaf-node-name="new leaf"></vue-tree> <vue-tree-list :model="data" default-tree-node-name="new node" default-leaf-node-name="new leaf"></vue-tree-list>
</div> </div>
<div class="container"> <div class="container">
@@ -92,7 +92,7 @@
</div> </div>
<script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="../dist/vue-tree.min.js"></script> <script src="../dist/vue-tree-list.min.js"></script>
<script> <script>
function isMobile() { function isMobile() {
var sUserAgent = navigator.userAgent.toLowerCase(); var sUserAgent = navigator.userAgent.toLowerCase();
@@ -115,14 +115,14 @@
new Vue({ new Vue({
el: '#app', el: '#app',
components: { components: {
'VueTree': vuetree.VueTree 'VueTreeList': VueTreeList.VueTreeList
}, },
data () { data () {
return { return {
isMobile: isMobile(), isMobile: isMobile(),
record: null, record: null,
newTree: {}, newTree: {},
data: new vuetree.Tree([ data: new VueTreeList.Tree([
{ {
name: 'Node 1', name: 'Node 1',
id: 1, id: 1,
@@ -151,11 +151,11 @@
}, },
methods: { methods: {
getTreeChange: function () { getTreeChange: function () {
this.record = Object.assign({}, vuetree.Record) this.record = Object.assign({}, VueTreeList.Record)
}, },
addNode: function () { addNode: function () {
var node = new vuetree.TreeNode('new node', false) var node = new VueTreeList.TreeNode('new node', false)
if (!this.data.children) this.data.children = [] if (!this.data.children) this.data.children = []
this.data.addChildren(node) this.data.addChildren(node)
}, },

View File

@@ -1,8 +1,8 @@
{ {
"name": "vue-tree", "name": "vue-tree-list",
"version": "1.0.0", "version": "1.0.0",
"description": "A vue component for tree structure.", "description": "A vue component for tree structure.",
"main": "dist/vue-tree.min.js", "main": "dist/vue-tree-list.min.js",
"scripts": { "scripts": {
"test": "karma start --single-run", "test": "karma start --single-run",
"unit": "karma start --watch", "unit": "karma start --watch",
@@ -11,7 +11,7 @@
}, },
"repository": { "repository": {
"type": "git", "type": "git",
"url": "git+https://github.com/ParadeTo/vue-tree.git" "url": "git+https://github.com/ParadeTo/vue-tree-list.git"
}, },
"keywords": [ "keywords": [
"vue", "vue",
@@ -20,9 +20,9 @@
"author": "ayou", "author": "ayou",
"license": "ISC", "license": "ISC",
"bugs": { "bugs": {
"url": "https://github.com/ParadeTo/vue-tree/issues" "url": "https://github.com/ParadeTo/vue-tree-list/issues"
}, },
"homepage": "https://github.com/ParadeTo/vue-tree#readme", "homepage": "https://github.com/ParadeTo/vue-tree-list#readme",
"dependencies": { "dependencies": {
"jquery": "^3.2.1" "jquery": "^3.2.1"
}, },

View File

@@ -1,25 +1,25 @@
# vue-tree # vue-tree-list
A vue component for tree structure. Support adding treenode/leafnode, editing node's name and dragging. A vue component for tree structure. Support adding treenode/leafnode, editing node's name and dragging.
![vue-tree-demo.gif](https://github.com/ParadeTo/vue-tree/tree/master/img/demo.gif) ![vue-tree-demo.gif](https://github.com/ParadeTo/vue-tree-list/tree/master/img/demo.gif)
[Live Demo](http://paradeto.com/vue-tree/) [Live Demo](http://paradeto.com/vue-tree-list/)
# use # use
``npm install vue-tree`` ``npm install vue-tree``
```javascript ```javascript
<button @click="addNode">Add Node</button> <button @click="addNode">Add Node</button>
<vue-tree :model="data" default-tree-node-name="new node" default-leaf-node-name="new leaf"></vue-tree> <vue-tree-list :model="data" default-tree-node-name="new node" default-leaf-node-name="new leaf"></vue-tree-list>
<button @click="getNewTree">Get new tree</button> <button @click="getNewTree">Get new tree</button>
<pre> <pre>
{{newTree}} {{newTree}}
</pre> </pre>
... ...
import { VueTree, Tree, TreeNode } from 'vue-tree' import { VueTreeList, Tree, TreeNode } from 'vue-tree'
export default { export default {
components: { components: {
VueTree VueTreeList
}, },
data () { data () {
return { return {

View File

@@ -238,7 +238,7 @@
} }
}, },
beforeCreate () { beforeCreate () {
this.$options.components.item = require('./VueTree.vue') this.$options.components.item = require('./VueTreeList.vue')
} }
} }
</script> </script>

View File

@@ -1,7 +1,7 @@
/** /**
* Created by ayou on 17/7/21. * Created by ayou on 17/7/21.
*/ */
exports.VueTree = require('./VueTree.vue') exports.VueTreeList = require('./VueTreeList.vue')
exports.TreeNode = require('./Tree.js').TreeNode exports.TreeNode = require('./Tree.js').TreeNode
exports.Tree = require('./Tree.js').Tree exports.Tree = require('./Tree.js').Tree
exports.Record = require('./Tree.js').Record exports.Record = require('./Tree.js').Record

View File

@@ -5,8 +5,8 @@ module.exports = {
entry: './src/index.js', entry: './src/index.js',
output: { output: {
path: path.resolve(__dirname, 'dist'), path: path.resolve(__dirname, 'dist'),
filename: 'vue-tree.min.js', filename: 'vue-tree-list.min.js',
library: 'vuetree', library: 'VueTreeList',
libraryTarget: 'umd' libraryTarget: 'umd'
}, },
module: { module: {