Commit 65b41a2d6f73314771e6035f94ea5bbeee39e65c
1 parent
96a6cb6c
fixed #635
Showing
2 changed files
with
28 additions
and
129 deletions
Show diff stats
examples/routers/cascader.vue
| 1 | -<!--<template>--> | |
| 2 | - <!--<div>--> | |
| 3 | - <!--<Cascader :data="data" v-model="value1"></Cascader>--> | |
| 4 | - <!--{{ value1 }}--> | |
| 5 | - <!--<div @click="c">change</div>--> | |
| 6 | - <!--</div>--> | |
| 7 | -<!--</template>--> | |
| 8 | -<!--<script>--> | |
| 9 | - <!--export default {--> | |
| 10 | - <!--data () {--> | |
| 11 | - <!--return {--> | |
| 12 | - <!--value1: [],--> | |
| 13 | - <!--data: [{--> | |
| 14 | - <!--value: 'beijing',--> | |
| 15 | - <!--label: '北京',--> | |
| 16 | - <!--children: [--> | |
| 17 | - <!--{--> | |
| 18 | - <!--value: 'gugong',--> | |
| 19 | - <!--label: '故宫'--> | |
| 20 | - <!--},--> | |
| 21 | - <!--{--> | |
| 22 | - <!--value: 'tiantan',--> | |
| 23 | - <!--label: '天坛'--> | |
| 24 | - <!--},--> | |
| 25 | - <!--{--> | |
| 26 | - <!--value: 'wangfujing',--> | |
| 27 | - <!--label: '王府井'--> | |
| 28 | - <!--}--> | |
| 29 | - <!--]--> | |
| 30 | - <!--}, {--> | |
| 31 | - <!--value: 'jiangsu',--> | |
| 32 | - <!--label: '江苏',--> | |
| 33 | - <!--children: [--> | |
| 34 | - <!--{--> | |
| 35 | - <!--value: 'nanjing',--> | |
| 36 | - <!--label: '南京',--> | |
| 37 | - <!--children: [--> | |
| 38 | - <!--{--> | |
| 39 | - <!--value: 'fuzimiao',--> | |
| 40 | - <!--label: '夫子庙',--> | |
| 41 | - <!--}--> | |
| 42 | - <!--]--> | |
| 43 | - <!--},--> | |
| 44 | - <!--{--> | |
| 45 | - <!--value: 'suzhou',--> | |
| 46 | - <!--label: '苏州',--> | |
| 47 | - <!--children: [--> | |
| 48 | - <!--{--> | |
| 49 | - <!--value: 'zhuozhengyuan',--> | |
| 50 | - <!--label: '拙政园',--> | |
| 51 | - <!--},--> | |
| 52 | - <!--{--> | |
| 53 | - <!--value: 'shizilin',--> | |
| 54 | - <!--label: '狮子林',--> | |
| 55 | - <!--}--> | |
| 56 | - <!--]--> | |
| 57 | - <!--}--> | |
| 58 | - <!--],--> | |
| 59 | - <!--}]--> | |
| 60 | - <!--}--> | |
| 61 | - <!--},--> | |
| 62 | - <!--methods: {--> | |
| 63 | - <!--c () {--> | |
| 64 | - <!--this.value1 = ['jiangsu', 'suzhou', 'zhuozhengyuan']--> | |
| 65 | - <!--}--> | |
| 66 | - <!--}--> | |
| 67 | - <!--}--> | |
| 68 | -<!--</script>--> | |
| 69 | - | |
| 70 | - | |
| 71 | 1 | <template> |
| 72 | 2 | <div> |
| 73 | - <Cascader :data="data" v-model="value2"></Cascader> | |
| 74 | - {{ value2 }} | |
| 75 | - <Button @click="c">clear</Button> | |
| 3 | + <Cascader :data="data2" v-model="v1" disabled clearable></Cascader> | |
| 4 | + <Cascader :data="data2" clearable></Cascader> | |
| 76 | 5 | </div> |
| 77 | 6 | </template> |
| 78 | 7 | <script> |
| 79 | 8 | export default { |
| 80 | 9 | data () { |
| 81 | 10 | return { |
| 82 | - value2: ['beijing', 'gugong'], | |
| 83 | - data: [] | |
| 84 | - } | |
| 85 | - }, | |
| 86 | - methods: { | |
| 87 | - c () { | |
| 88 | - this.value2 = [] | |
| 89 | - } | |
| 90 | - }, | |
| 91 | - mounted () { | |
| 92 | - this.data = [{ | |
| 93 | - value: 'beijing', | |
| 94 | - label: '北京', | |
| 95 | - children: [ | |
| 96 | - { | |
| 97 | - value: 'gugong', | |
| 98 | - label: '故宫' | |
| 99 | - }, | |
| 100 | - { | |
| 101 | - value: 'tiantan', | |
| 102 | - label: '天坛' | |
| 103 | - }, | |
| 104 | - { | |
| 105 | - value: 'wangfujing', | |
| 106 | - label: '王府井' | |
| 107 | - } | |
| 108 | - ] | |
| 109 | - }, { | |
| 110 | - value: 'jiangsu', | |
| 111 | - label: '江苏', | |
| 112 | - children: [ | |
| 113 | - { | |
| 11 | + v1: ['zhejiang', 'hangzhou', 'xihu'], | |
| 12 | + data2: [{ | |
| 13 | + value: 'zhejiang', | |
| 14 | + label: '浙江', | |
| 15 | + children: [{ | |
| 16 | + value: 'hangzhou', | |
| 17 | + label: '杭州', | |
| 18 | + children: [{ | |
| 19 | + value: 'xihu', | |
| 20 | + label: '西湖' | |
| 21 | + }] | |
| 22 | + }] | |
| 23 | + }, { | |
| 24 | + value: 'jiangsu', | |
| 25 | + label: '江苏', | |
| 26 | + disabled: true, | |
| 27 | + children: [{ | |
| 114 | 28 | value: 'nanjing', |
| 115 | 29 | label: '南京', |
| 116 | - children: [ | |
| 117 | - { | |
| 118 | - value: 'fuzimiao', | |
| 119 | - label: '夫子庙', | |
| 120 | - } | |
| 121 | - ] | |
| 122 | - }, | |
| 123 | - { | |
| 124 | - value: 'suzhou', | |
| 125 | - label: '苏州', | |
| 126 | - children: [ | |
| 127 | - { | |
| 128 | - value: 'zhuozhengyuan', | |
| 129 | - label: '拙政园', | |
| 130 | - }, | |
| 131 | - { | |
| 132 | - value: 'shizilin', | |
| 133 | - label: '狮子林', | |
| 134 | - } | |
| 135 | - ] | |
| 136 | - } | |
| 137 | - ], | |
| 138 | - }] | |
| 30 | + children: [{ | |
| 31 | + value: 'zhonghuamen', | |
| 32 | + label: '中华门' | |
| 33 | + }] | |
| 34 | + }] | |
| 35 | + }] | |
| 36 | + } | |
| 139 | 37 | } |
| 140 | 38 | } |
| 141 | 39 | </script> | ... | ... |
src/components/cascader/cascader.vue
| ... | ... | @@ -112,7 +112,7 @@ |
| 112 | 112 | ]; |
| 113 | 113 | }, |
| 114 | 114 | showCloseIcon () { |
| 115 | - return this.currentValue && this.currentValue.length && this.clearable; | |
| 115 | + return this.currentValue && this.currentValue.length && this.clearable && !this.disabled; | |
| 116 | 116 | }, |
| 117 | 117 | displayRender () { |
| 118 | 118 | let label = []; |
| ... | ... | @@ -125,6 +125,7 @@ |
| 125 | 125 | }, |
| 126 | 126 | methods: { |
| 127 | 127 | clearSelect () { |
| 128 | + if (this.disabled) return false; | |
| 128 | 129 | const oldVal = JSON.stringify(this.currentValue); |
| 129 | 130 | this.currentValue = this.selected = this.tmpSelected = []; |
| 130 | 131 | this.handleClose(); | ... | ... |