From 5dd27477e010542b4c691dfbcaa856765716f53b Mon Sep 17 00:00:00 2001 From: qimengjie Date: Thu, 25 Jul 2019 20:58:45 +0800 Subject: [PATCH] Update --- src/index.js | 112 +++++++++++++++--------------- tools/demo/pages/index/index.js | 50 ++++++++++++- tools/demo/pages/index/index.wxml | 16 +++++ 3 files changed, 122 insertions(+), 56 deletions(-) diff --git a/src/index.js b/src/index.js index c12d0f5..f0b4704 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,9 @@ /* 参考文档: https://github.com/IceApriler/miniprogram-picker */ +function isExist(field) { + return field !== null && field !== undefined +} + Component({ /** * 组件的属性列表 @@ -99,53 +103,52 @@ Component({ // 源数组更新，则需要更新multiIndex、multiArray const multiIndex = [] const multiArray = [] - const { countError } = this.checkSourceData(newSourceData) - if (countError > 0) { - console.warn(`miniprogram-picker: 初始化源数组时检测到有${countError}个错误，为了方便排查修改已经为你做出了相关提示，请修改后再试，务必保证数据源的数据结构无误。`) - } else { - const defaultIndex = this.getDefaultIndex(newSourceData) - const handle = (source = [], columnIndex = 0) => { - // 当前遍历Picker的第columnIndex列， - // 当columnIndex = 0时，source表示sourceData，其它则表示子集subset - const _multiArrayColumn0 = [] + newSourceData = this.checkSourceData(newSourceData) - source.forEach((item, index) => { - if (columnIndex === 0) { - // newSourceData的第0维要单独处理，最后unshift到multiArray中 - _multiArrayColumn0.push(item[shownFieldName]) - } + console.warn(newSourceData) - if (item[shownFieldName] && index === (defaultIndex[columnIndex] || 0)) { - // 选中的索引和值，默认取每列的第0个 - multiIndex.push(index) + const defaultIndex = this.getDefaultIndex(newSourceData) + const handle = (source = [], columnIndex = 0) => { + // 当前遍历Picker的第columnIndex列， + // 当columnIndex = 0时，source表示sourceData，其它则表示子集subset + const _multiArrayColumn0 = [] - if (columnIndex < steps - 1) { - if (item[subsetFieldName]) { - // 开始处理下一维的数据 - const _subsetArr = item[subsetFieldName].map(sub => sub[shownFieldName]) - multiArray.push(_subsetArr) - handle(item[subsetFieldName], columnIndex + 1) - } + source.forEach((item, index) => { + if (columnIndex === 0) { + // newSourceData的第0维要单独处理，最后unshift到multiArray中 + _multiArrayColumn0.push(item[shownFieldName]) + } + + if (item[shownFieldName] && index === (defaultIndex[columnIndex] || 0)) { + // 选中的索引和值，默认取每列的第0个 + multiIndex.push(index) + + if (columnIndex < steps - 1) { + if (item[subsetFieldName]) { + // 开始处理下一维的数据 + const _subsetArr = item[subsetFieldName].map(sub => sub[shownFieldName]) + multiArray.push(_subsetArr) + handle(item[subsetFieldName], columnIndex + 1) } } - }) - - if (columnIndex === 0) { - multiArray.unshift(_multiArrayColumn0) } - } - - handle(newSourceData) - - this.setData({ - multiIndex, - multiArray }) - if (this.data.autoSelect) { - this.processData() + if (columnIndex === 0) { + multiArray.unshift(_multiArrayColumn0) } } + + handle(newSourceData) + + this.setData({ + multiIndex, + multiArray + }) + + if (this.data.autoSelect) { + this.processData() + } }, /** * 获取默认值index @@ -213,34 +216,33 @@ Component({ */ checkSourceData(sourceData) { const { shownFieldName, subsetFieldName, steps } = this.data - let countError = 0 const handle = (source = [], columnIndex = 0) => { // 当前遍历Picker的第columnIndex列， // 当columnIndex = 0时，source表示sourceData，其它则表示子集subset - - source.forEach((item) => { - if (!item[shownFieldName]) { - countError++ + if (!source.length) { + const temp = {} + temp[shownFieldName] = '' + temp[subsetFieldName] = [] + source.push(temp) + } + return source.map((item) => { + if (!isExist(item[shownFieldName])) { this.consoleError(item, new Error(`源数组第${columnIndex}维(从0开始计算)的对象中缺少"${shownFieldName}"字段`)) + item[shownFieldName] = '' } - if (item[shownFieldName]) { - // 有shownFieldName字段才会去遍历subsetFieldName字段 - if (columnIndex < steps - 1) { - if (item[subsetFieldName]) { - // 开始处理下一维的数据 - handle(item[subsetFieldName], columnIndex + 1) - } else { - countError++ - this.consoleError(item, new Error(`源数组第${columnIndex}维(从0开始计算)的对象中缺少"${subsetFieldName}"字段`)) - } + // 有shownFieldName字段才会去遍历subsetFieldName字段 + if (columnIndex < steps - 1) { + if (!isExist(item[subsetFieldName])) { + this.consoleError(item, new Error(`源数组第${columnIndex}维(从0开始计算)的对象中缺少"${subsetFieldName}"字段`)) } + // 开始处理下一维的数据 + item[subsetFieldName] = handle(item[subsetFieldName], columnIndex + 1) } + return item }) } - - handle(sourceData) - return { countError } + return handle(sourceData) }, /** diff --git a/tools/demo/pages/index/index.js b/tools/demo/pages/index/index.js index 6ea5a56..a37a182 100644 --- a/tools/demo/pages/index/index.js +++ b/tools/demo/pages/index/index.js @@ -5,6 +5,7 @@ Page({ data: { result_1: [], result_2: [], + result_3: [], sourceData_1: [ { id: 'id-1', @@ -54,7 +55,53 @@ Page({ sourceData_2: [ { name: '河北', code: '0311', nextLevel: [{ name: '石家庄', code: '031101' }, { name: '保定', code: '031102' }]}, { name: '北京', code: '0110', nextLevel: [{ name: '朝阳', code: '011001' }, { name: '海淀', code: '011002' }]}, - ] + ], + sourceData_3: [{ + id: '6cb8bd37-f8ae-4a6b-a236-3bab1b65cd8d', + parentId: '0', + name: '整形', + sonValue: [{ + id: 'd4b6d3af-2edb-44a5-9851-c8964cf10d2c', + parentId: '6cb8bd37-f8ae-4a6b-a236-3bab1b65cd8d', + name: '眼部整形', + sonValue: [{ + id: 'e531e96f-a081-40a7-a133-091be46983a2', + parentId: 'd4b6d3af-2edb-44a5-9851-c8964cf10d2c', + name: '双眼皮', + sonValue: [] + }] + }, { + id: '403d93d3-5302-4682-a988-6dbfbe7ff563', + parentId: '6cb8bd37-f8ae-4a6b-a236-3bab1b65cd8d', + name: '胸部整形', + sonValue: [{ + id: '46afdd93-c830-4d0d-bd5d-c0751a0c087a', + parentId: '403d93d3-5302-4682-a988-6dbfbe7ff563', + name: '丰胸', + sonValue: [{ + id: '127a3cda-cd91-48b5-997c-6d56a4a02e80', + parentId: '46afdd93-c830-4d0d-bd5d-c0751a0c087a', + name: '自体脂肪丰胸', + sonValue: [] + }] + }] + }] + }, { + id: 'a4f22a1a-0c49-46cd-bb1f-ca551b1e01cb', + parentId: '0', + name: '皮肤', + sonValue: [{ + id: 'dfa5137c-616b-403c-a552-164e05518072', + parentId: 'a4f22a1a-0c49-46cd-bb1f-ca551b1e01cb', + name: '脱毛美容', + sonValue: [] + }, { + id: 'bfd1eb85-93c1-489e-acba-ac3e783c83f0', + parentId: 'a4f22a1a-0c49-46cd-bb1f-ca551b1e01cb', + name: '艺术纹绣', + sonValue: [] + }] + }] }, /** * Picker用户点击确认时触发 @@ -69,6 +116,7 @@ Page({ const list = { picker_1: 'result_1', picker_2: 'result_2', + picker_3: 'result_3', } console.log('多级联动结果:', selectedIndex, selectedArray) const change = {} diff --git a/tools/demo/pages/index/index.wxml b/tools/demo/pages/index/index.wxml index 19182ba..81509ec 100644 --- a/tools/demo/pages/index/index.wxml +++ b/tools/demo/pages/index/index.wxml @@ -50,4 +50,20 @@ 当前选择：{{item['name']}} + + + + + 当前选择：{{item['name']}} + \ No newline at end of file