remove unnessesary components
This commit is contained in:
parent
6c415a0ffe
commit
78d64a2319
@ -1,102 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="tree">
|
|
||||||
<h1>tree dropdown</h1>
|
|
||||||
|
|
||||||
<ul>
|
|
||||||
<Treeitem :data='data'></Treeitem>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import Treeitem from "@/components/treeitem.vue";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "Tree",
|
|
||||||
components: {
|
|
||||||
Treeitem
|
|
||||||
},
|
|
||||||
data: function() {
|
|
||||||
return {
|
|
||||||
data: {
|
|
||||||
name: "中国",
|
|
||||||
children: [
|
|
||||||
{ name: "广州省" },
|
|
||||||
{
|
|
||||||
name: "山东省",
|
|
||||||
children: [{ name: "a路" }, { name: "b路" }, { name: "c路" }]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "福建省",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "福州市",
|
|
||||||
children: [{ name: "a路" }, { name: "b路" }]
|
|
||||||
},
|
|
||||||
{ name: "长乐市" },
|
|
||||||
{ name: "厦门市" },
|
|
||||||
{
|
|
||||||
name: "福清市",
|
|
||||||
children: [{ name: "a路" }, { name: "b路" }]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
created: function() {}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
||||||
/*
|
|
||||||
|
|
||||||
|
|
||||||
provinces: [
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "fujian",
|
|
||||||
cities: [
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "fuzhou",
|
|
||||||
districts: [
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "taijian",
|
|
||||||
roads: [{ name: "taijian-a" }, { name: "taijian-b" }]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "gulou",
|
|
||||||
roads: [{ name: "gulou-c" }, { name: "gulou-d" }]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "guangzhou",
|
|
||||||
cities: [
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "guangdong",
|
|
||||||
districts: [
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "yuexiue",
|
|
||||||
roads: [{ name: "yuexue-a" }, { name: "yuexue-b" }]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
show: true,
|
|
||||||
name: "dongguang",
|
|
||||||
roads: [{ name: "dongguang-c" }, { name: "donguang-d" }]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
] */
|
|
@ -1,53 +0,0 @@
|
|||||||
<template>
|
|
||||||
<li >
|
|
||||||
<span @click="toggle" >{{data.name}}</span>
|
|
||||||
<ul >
|
|
||||||
<treeitem v-for="data in data.children" :data='data' v-show="show"></treeitem>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: "treeitem",
|
|
||||||
props: ["data"],
|
|
||||||
data: function() {
|
|
||||||
return {
|
|
||||||
show: false
|
|
||||||
};
|
|
||||||
},
|
|
||||||
created: function() {},
|
|
||||||
computed: {
|
|
||||||
haschildren() {
|
|
||||||
return this.data.children && this.data.children.length;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
toggle: function() {
|
|
||||||
console.log(this.haschildren);
|
|
||||||
if (this.haschildren) {
|
|
||||||
this.show = !this.show;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
<template>
|
|
||||||
<ul v-show="show">
|
|
||||||
<li v-for="data in data.children" @click="toggle" >
|
|
||||||
<span>{{data.name}}</span>
|
|
||||||
<treeitem :data='data' ></treeitem>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</template>
|
|
||||||
-->
|
|
Loading…
Reference in New Issue
Block a user