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 | <template> | 1 | <template> |
| 72 | <div> | 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 | </div> | 5 | </div> |
| 77 | </template> | 6 | </template> |
| 78 | <script> | 7 | <script> |
| 79 | export default { | 8 | export default { |
| 80 | data () { | 9 | data () { |
| 81 | return { | 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 | value: 'nanjing', | 28 | value: 'nanjing', |
| 115 | label: '南京', | 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 | </script> | 39 | </script> |
src/components/cascader/cascader.vue
| @@ -112,7 +112,7 @@ | @@ -112,7 +112,7 @@ | ||
| 112 | ]; | 112 | ]; |
| 113 | }, | 113 | }, |
| 114 | showCloseIcon () { | 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 | displayRender () { | 117 | displayRender () { |
| 118 | let label = []; | 118 | let label = []; |
| @@ -125,6 +125,7 @@ | @@ -125,6 +125,7 @@ | ||
| 125 | }, | 125 | }, |
| 126 | methods: { | 126 | methods: { |
| 127 | clearSelect () { | 127 | clearSelect () { |
| 128 | + if (this.disabled) return false; | ||
| 128 | const oldVal = JSON.stringify(this.currentValue); | 129 | const oldVal = JSON.stringify(this.currentValue); |
| 129 | this.currentValue = this.selected = this.tmpSelected = []; | 130 | this.currentValue = this.selected = this.tmpSelected = []; |
| 130 | this.handleClose(); | 131 | this.handleClose(); |