更新记录
1.0.0(2023-03-22) 下载此版本
初始化,支持单选
平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.1.0 | × | √ | √ | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
× | × | × | × | × | × | × | × | × |
jiangcs-tree-picker
使用方法
template中定义组件
<jiangcs-tree-picker ref="treePicker" :dataArr="dataArr" @select="selectOrg"></jiangcs-tree-picker>
节点数组
dataArr: [{
id: 1,
title: '公司',
pid: 0,
expand: true,
children: [{
id: 11,
title: '研发部',
pid: 2,
expand: false,
children: [{
id: 111,
title: '研发部-1部',
pid: 3,
expand: false
}]
}, {
id: 12,
title: '综合部',
pid: 1,
expand: false
}]
}]
js定义select方法
selectOrg(type, node) {
if (type === 'confirm') {
// 业务逻辑
}
}
js打开弹框
this.$refs.treePicker.open();
store支持
- 定义tree.js
export default {
namespaced: true,
state: {
node: {
id: 0,
name: ''
}
},
mutations: {
updateNode(state, node) {
state.node = node;
}
},
actions: {
// 更新节点
updateNode({
commit
}, node) {
commit('updateNode', node);
}
}
}