support Cascader

support Cascader
This commit is contained in:
梁灏 2017-03-06 17:30:39 +08:00
parent 2d43f26b05
commit 47a7f21dc6
11 changed files with 195 additions and 94 deletions

View file

@ -1,24 +1,85 @@
<template>
{{ text }}
<Cascader :data="data" @on-change="handleChange">
<a href="javascript:void(0)">选择</a>
</Cascader>
<!--<template>-->
<!--<div>-->
<!--<Cascader :data="data" v-model="value1"></Cascader>-->
<!--{{ value1 }}-->
<!--<div @click="c">change</div>-->
<!--</div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--data () {-->
<!--return {-->
<!--value1: [],-->
<!--data: [{-->
<!--value: 'beijing',-->
<!--label: '北京',-->
<!--children: [-->
<!--{-->
<!--value: 'gugong',-->
<!--label: '故宫'-->
<!--},-->
<!--{-->
<!--value: 'tiantan',-->
<!--label: '天坛'-->
<!--},-->
<!--{-->
<!--value: 'wangfujing',-->
<!--label: '王府井'-->
<!--}-->
<!--]-->
<!--}, {-->
<!--value: 'jiangsu',-->
<!--label: '江苏',-->
<!--children: [-->
<!--{-->
<!--value: 'nanjing',-->
<!--label: '南京',-->
<!--children: [-->
<!--{-->
<!--value: 'fuzimiao',-->
<!--label: '夫子庙',-->
<!--}-->
<!--]-->
<!--},-->
<!--{-->
<!--value: 'suzhou',-->
<!--label: '苏州',-->
<!--children: [-->
<!--{-->
<!--value: 'zhuozhengyuan',-->
<!--label: '拙政园',-->
<!--},-->
<!--{-->
<!--value: 'shizilin',-->
<!--label: '狮子林',-->
<!--}-->
<!--]-->
<!--}-->
<!--],-->
<!--}]-->
<!--}-->
<!--},-->
<!--methods: {-->
<!--c () {-->
<!--this.value1 = ['jiangsu', 'suzhou', 'zhuozhengyuan']-->
<!--}-->
<!--}-->
<!--}-->
<!--</script>-->
<Row>
<i-col span="4">
Disabled <Switch :checked.sync="disabled"></Switch>
</i-col>
<i-col span="4">
<Cascader :data="data" :value.sync="value1" :disabled="disabled"></Cascader>
</i-col>
</Row>
<template>
<div>
<Cascader :data="data" v-model="value2" change-on-select></Cascader>
{{ value2 }}
<div @click="c">change</div>
</div>
</template>
<script>
export default {
data () {
return {
disabled: false,
text: '未选择',
value2: [],
data: [{
value: 'beijing',
label: '北京',
@ -69,8 +130,8 @@
}
},
methods: {
handleChange (value, selectedData) {
this.text = selectedData.map(o => o.label).join(', ');
c () {
this.value2 = ['jiangsu', 'suzhou', 'zhuozhengyuan']
}
}
}