69 lines
2.1 KiB
Vue
69 lines
2.1 KiB
Vue
/* eslint react/no-multi-comp:0, no-console:0, no-alert: 0 */
|
|
|
|
import BaseMixin from '../../_util/BaseMixin'
|
|
import '../assets/index.less'
|
|
import '../../vc-dialog/assets/index.less'
|
|
import TreeSelect, { TreeNode } from '../src/index'
|
|
import './demo.less'
|
|
|
|
export default {
|
|
mixins: [BaseMixin],
|
|
data: () => ({
|
|
treeExpandedKeys: [],
|
|
}),
|
|
methods: {
|
|
onTreeExpand (treeExpandedKeys) {
|
|
this.setState({
|
|
treeExpandedKeys,
|
|
})
|
|
},
|
|
|
|
setTreeExpandedKeys () {
|
|
this.setState({
|
|
treeExpandedKeys: ['000', '0-1-0'],
|
|
})
|
|
},
|
|
|
|
},
|
|
|
|
render () {
|
|
const { treeExpandedKeys } = this
|
|
|
|
return (
|
|
<div>
|
|
<h2>Conrolled treeExpandedKeys</h2>
|
|
<TreeSelect
|
|
style={{ width: '200px' }}
|
|
dropdownStyle={{ maxHeight: '200px', overflow: 'auto' }}
|
|
treeExpandedKeys={treeExpandedKeys}
|
|
onTreeExpand={this.onTreeExpand}
|
|
__propsSymbol__={Symbol()}
|
|
>
|
|
<TreeNode value='' title='parent 1' key='000'>
|
|
<TreeNode value='parent 1-0' title='parent 1-0' key='0-1-0'>
|
|
<TreeNode value='leaf1' title='my leaf' key='random' />
|
|
<TreeNode value='leaf2' title='your leaf' key='random1' disabled />
|
|
</TreeNode>
|
|
<TreeNode value='parent 1-1' title='parent 1-1' key='0-1-1'>
|
|
<TreeNode value='sss'
|
|
title={<span style={{ color: 'red' }}>sss</span>} key='random3'
|
|
/>
|
|
<TreeNode value='same value1' title='same txtle' key='0-1-1-1'>
|
|
<TreeNode value='same value10' title='same titlexd' key='0-1-1-1-0' style={{ color: 'red', background: 'green' }} />
|
|
</TreeNode>
|
|
</TreeNode>
|
|
</TreeNode>
|
|
<TreeNode value='same value2' title='same title' key='0-2'>
|
|
<TreeNode value='2same value' title='2same title' key='0-2-0' />
|
|
</TreeNode>
|
|
<TreeNode value='same value3' title='same title' key='0-3' />
|
|
</TreeSelect>
|
|
<button onClick={this.setTreeExpandedKeys}>
|
|
Set treeExpandedKeys
|
|
</button>
|
|
</div>
|
|
)
|
|
},
|
|
}
|
|
|