望都网站建设品牌建设工作纪实

小程序原生开发 Tdesign TreeSelect 树形选择 多选可以选择不同一级分类下的数据

TreeSelect 树形选择

在原demo基础上修改

const chineseNumber = '一二三四五六七八九十'.split('');const generateTree = function (deep = 0, count = 10, prefix) {const ans = [];for (let i = 0; i < count; i += 1) {const value = prefix ? `${prefix}-${i}` : `${i}`;const rect = {label: `选项${chineseNumber[i]}`,value,};if (deep > 0) {rect.children = generateTree(deep - 1, 10, value);}ans.push(rect);}return ans;
};Component({data: {options: generateTree(1),value: ['0', ['0-0', '0-1']],allValue: [['0', ['0-0', '0-1']],['1', ['1-0', '1-1']]],},methods: {onChange(e) {this.setData({value: e.detail.value,});if (e.detail.level == 0) {//点击一级分类 从allValue中找到历史值 替换const value = this.data.allValue.find(array => array[0] === e.detail.value[0])if (value == null) {this.setData({value: e.detail.value,});} else {this.setData({value: value,});}} else {//判断是否包含一级分类数据var result = this.data.allValue.some(item => {if (item[0] == e.detail.value[0]) {return true}})if (result) {// 使用 map() 方法替换元素let newArr = this.data.allValue.map(item => {if (e.detail.value[0] == item[0]) {return e.detail.value;} else {return item;}});console.log(newArr)this.setData({allValue: newArr})} else {//添加元素this.data.allValue.push(e.detail.value)}}},},
});