You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ant-design-vue/components/vc-tree-select/demo/disable.jsx

81 lines
1.4 KiB

/* eslint react/no-multi-comp:0, no-console:0 */
import '../assets/index.less'
import TreeSelect from '../index'
const SHOW_PARENT = TreeSelect.SHOW_PARENT
const treeData = [{
label: 'Node1',
value: '0-0',
key: '0-0',
children: [{
label: 'Child Node1',
value: '0-0-0',
key: '0-0-0',
}],
}, {
label: 'Node2',
value: '0-1',
key: '0-1',
children: [{
label: 'Child Node3',
value: '0-1-0',
key: '0-1-0',
}, {
label: 'Child Node4',
value: '0-1-1',
key: '0-1-1',
}, {
label: 'Child Node5',
value: '0-1-2',
key: '0-1-2',
}],
}]
export default {
data () {
return {
value: ['0-0-0'],
disabled: false,
}
},
methods: {
onChange (value) {
console.log('onChange ', value, arguments)
this.value = value
},
switch (checked) {
this.disabled = checked
},
},
render () {
const tProps = {
props: {
treeData,
disabled: this.disabled,
value: this.value,
multiple: true,
allowClear: true,
treeCheckable: true,
showCheckedStrategy: SHOW_PARENT,
searchPlaceholder: 'Please select',
},
on: {
change: this.onChange,
},
style: {
width: '300px',
},
}
return (
<div>
<TreeSelect {...tProps} />
<input type='checkbox' onChange={e => this.switch(e.target.checked)}/> 禁用
</div>
)
},
}