From 1f4adcabb5e2127b5b0bb3d6d83b4d430c35b4d1 Mon Sep 17 00:00:00 2001 From: jingkaimori Date: Tue, 4 Aug 2020 11:10:03 +0800 Subject: [PATCH 1/3] fix: remove package MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 移除不存在的包@tencent/tslint-config-wxapp --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index e196376..c468180 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,6 @@ "devDependencies": { "@commitlint/cli": "^8.2.0", "@commitlint/config-conventional": "^8.2.0", - "@tencent/tslint-config-wxapp": "0.0.2", "autoprefixer": "^6.5.1", "babel-core": "^6.26.3", "babel-loader": "^7.1.5", From edfbd7f4a94de6ecdb03250cd2fe5a04ce8c271a Mon Sep 17 00:00:00 2001 From: jingkaimori Date: Tue, 4 Aug 2020 12:24:08 +0800 Subject: [PATCH 2/3] feat: update index-list MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 为index-list添加选择和不可用样式，同时更新文档 --- docs/index-list.md | 18 +++++++++++++----- src/index-list/index.less | 9 +++++++++ src/index-list/index.wxml | 2 +- 3 files changed, 23 insertions(+), 6 deletions(-) diff --git a/docs/index-list.md b/docs/index-list.md index db3d030..4112c83 100644 --- a/docs/index-list.md +++ b/docs/index-list.md @@ -6,7 +6,7 @@ | 属性 | 类型 | 默认值 | 必填 | 说明 | | ---------- | --------------- | ------ | ---- | ------------------------------------- | -| list | Array | [] | 是 | 列表数据 | +| list | Array\ | [] | 是 | 列表数据 | | vibrated | boolean | true | 否 | 索引上滑动时是否产生振动，仅 iOS 生效 | | bindchoose | eventhandle | | 否 | 选择列表项, e.detail={name} | @@ -15,13 +15,21 @@ | 属性 | 类型 | 说明 | | -------- | -------------- | ------------ | | alpha | string | 首字母(大写) | -| subItems | Array | 子元素集合 | +| subItems | Array\ | 子元素集合 | ### subItem 属性列表 -| 属性 | 类型 | 说明 | -| ---- | ------ | ---- | -| name | string | 名称 | +| 属性 | 类型 | 必填 | 说明 | +| ---- | ------ | -- | ---- | +| name | string | 是 | 名称 | +| style | string | 否 | 样式 | + +### style 的合法值 + +| 属性 | 类型 | +| ---- | ---------------------- | +| selected | 高亮该条目 | +| disabled | 将该条目置为不可用状态 | | ### 注意事项 diff --git a/src/index-list/index.less b/src/index-list/index.less index 0f0267b..56af5f8 100644 --- a/src/index-list/index.less +++ b/src/index-list/index.less @@ -39,6 +39,15 @@ .index-group__item.thin-border-bottom:after{ left: 24rpx; } +.selected{ + color: #1aad19; +} +.disabled{ + color: hsla(0,0%,100%,.2); +} +.bg-highlight,.selected{ + background-color: #f2f2f2; +} .anchor-bar__wrp{ position: fixed; diff --git a/src/index-list/index.wxml b/src/index-list/index.wxml index 136f0ab..f92cbb7 100644 --- a/src/index-list/index.wxml +++ b/src/index-list/index.wxml @@ -15,7 +15,7 @@ From d985d960efe72fb82479bb95604a2ceba2ef7bd4 Mon Sep 17 00:00:00 2001 From: jingkaimori Date: Thu, 6 Aug 2020 15:27:53 +0800 Subject: [PATCH 3/3] feat: index-list selectable MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 为index-list添加选择功能 --- docs/index-list.md | 40 +++++++++---------- src/index-list/index.less | 2 +- src/index-list/index.ts | 39 ++++++++++++++++-- src/index-list/index.wxml | 5 ++- src/index-list/index.wxs | 34 ++++++++++++++++ tools/demo/example/index-list/index-list.js | 12 +++++- tools/demo/example/index-list/index-list.wxml | 4 +- tools/demo/project.config.json | 2 - 8 files changed, 107 insertions(+), 31 deletions(-) create mode 100644 src/index-list/index.wxs diff --git a/docs/index-list.md b/docs/index-list.md index 4112c83..eb816bb 100644 --- a/docs/index-list.md +++ b/docs/index-list.md @@ -2,34 +2,32 @@ 索引列表组件，可实现类似通讯录效果。组件内节点将被添加到列表上方。 +列表支持多选。如果将```selecting```属性置为```true```，列表就会进入可选择状态,。如果将```selecting```属性置为```false```，列表就会退出可选择状态，同时发送```bindselect```事件。 + ## 属性列表 -| 属性 | 类型 | 默认值 | 必填 | 说明 | -| ---------- | --------------- | ------ | ---- | ------------------------------------- | -| list | Array\ | [] | 是 | 列表数据 | -| vibrated | boolean | true | 否 | 索引上滑动时是否产生振动，仅 iOS 生效 | -| bindchoose | eventhandle | | 否 | 选择列表项, e.detail={name} | +| 属性 | 类型 | 默认值 | 必填 | 说明 | +| ---------- | ---------------- | ------ | ---- | --------------------------------------------------- | +| list | Array\ | [] | 是 | 列表数据 | +| vibrated | boolean | true | 否 | 索引上滑动时是否产生振动，仅 iOS 生效 | +| selecting | boolean | false | 否 | 列表是否为可选择状态 | +| bindchoose | eventhandle | | 否 | 单击列表项, e.detail={item:subItem} | +| bindselect | eventhandle | | 否 | 列表退出选择状态, e.detail={selected:Array\} | -### listItem 属性列表 +### listItem 对象的属性列表 -| 属性 | 类型 | 说明 | -| -------- | -------------- | ------------ | -| alpha | string | 首字母(大写) | +| 属性 | 类型 | 说明 | +| -------- | --------------- | ------------ | +| alpha | string | 首字母（大写） | | subItems | Array\ | 子元素集合 | -### subItem 属性列表 - -| 属性 | 类型 | 必填 | 说明 | -| ---- | ------ | -- | ---- | -| name | string | 是 | 名称 | -| style | string | 否 | 样式 | - -### style 的合法值 +### subItem 对象的属性列表 -| 属性 | 类型 | -| ---- | ---------------------- | -| selected | 高亮该条目 | -| disabled | 将该条目置为不可用状态 | | +| 属性 | 类型 | 必填 | 说明 | +| -------- | ------- | -- | ------------ | +| name | string | 是 | 名称 | +| selected | boolean | 否 | 是否已经被选择 | +| disabled | boolean | 否 | 是否可以被选择 | ### 注意事项 diff --git a/src/index-list/index.less b/src/index-list/index.less index 56af5f8..1fc8741 100644 --- a/src/index-list/index.less +++ b/src/index-list/index.less @@ -43,7 +43,7 @@ color: #1aad19; } .disabled{ - color: hsla(0,0%,100%,.2); + color: rgba(0, 0, 0, 0.5); } .bg-highlight,.selected{ background-color: #f2f2f2; diff --git a/src/index-list/index.ts b/src/index-list/index.ts index 2b24318..cfe5ca2 100644 --- a/src/index-list/index.ts +++ b/src/index-list/index.ts @@ -48,7 +48,7 @@ Component({ observer: function(newVal) { if (newVal.length === 0) return const data: any = this.data - const alphabet = data.list.map(item => item.alpha) + const alphabet:Array = data.list.map(item => item.alpha) this.setData({ alphabet, current: alphabet[0] @@ -61,6 +61,17 @@ Component({ vibrated: { type: Boolean, value: true + }, + selecting: { + type: Boolean, + value: false, + observer: function (newVal:Boolean) { + if (newVal){ + this.data.selected = []; + }else{ + this.triggerEvent('select',{selected:this.data.selected}) + } + } } }, @@ -70,6 +81,7 @@ Component({ intoView: '', touching: false, alphabet: [], + selected: [], _tops: [], _anchorItemH: 0, _anchorItemW: 0, @@ -88,9 +100,19 @@ Component({ } }, methods: { - choose(e) { - const item = e.target.dataset.item - this.triggerEvent('choose', {item}) + choose(item:{item:subItem,selected:boolean}) { + //let item = e.target.dataset.item + let selected:Array = this.data.selected + const curItem = selected.findIndex((v)=> v.name==item.item.name) + + if(item.selected){ + selected.splice(curItem,1); + }else{ + if(curItem<0){ + selected.push(item.item); + } + } + this.triggerEvent('choose', {item:item.item}) }, scrollTo(e) { this.__scrollTo(e) @@ -158,3 +180,12 @@ Component({ } } }) + +interface subItem{ + name:string, + style:"selected"|"disabled"|"" +} +interface listItem{ + alpha:string, + subItems:Array +} \ No newline at end of file diff --git a/src/index-list/index.wxml b/src/index-list/index.wxml index f92cbb7..46bad4c 100644 --- a/src/index-list/index.wxml +++ b/src/index-list/index.wxml @@ -9,6 +9,7 @@ + {{item.alpha}} @@ -17,8 +18,10 @@ + bindtap="{{index.toggle}}"> {{subItem.name}} diff --git a/src/index-list/index.wxs b/src/index-list/index.wxs new file mode 100644 index 0000000..85632e8 --- /dev/null +++ b/src/index-list/index.wxs @@ -0,0 +1,34 @@ +module.exports.toggle =function (event,instance) { + //instance.getDataset().selecting&& + var dataset= event.target.dataset + var item = dataset.item + var curInst = event.instance + if(!item.disabled&&dataset.selecting){ + if(curInst.hasClass('selected')){ + curInst.removeClass('selected') + instance.callMethod('choose',{ + item:item, + selected:true + }); + }else{ + curInst.addClass('selected') + instance.callMethod('choose',{ + item:item, + selected:false + }); + } + } +} + +module.exports.init = function (newValue,oldValue,hostInst,inst) { + var item = inst.getDataset().item + if(item.disabled){ + inst.addClass('disabled') + }else{ + if(newValue&&item.selected){ + inst.addClass('selected') + }else{ + inst.removeClass('selected') + } + } +} \ No newline at end of file diff --git a/tools/demo/example/index-list/index-list.js b/tools/demo/example/index-list/index-list.js index 01e2fb5..eedb8df 100644 --- a/tools/demo/example/index-list/index-list.js +++ b/tools/demo/example/index-list/index-list.js @@ -3,6 +3,9 @@ const QQMapKey = 'NDLBZ-4Y6KF-S2LJ6-NAOAA-BOW56-LMB44' const qqmapsdk = new QQMapWX({ key: QQMapKey }) Page({ + data:{ + select:false + }, onLoad() { this.getCitys() }, @@ -10,7 +13,14 @@ Page({ onChoose(e) { console.log('onChoose', e) }, - + onSelect(e) { + console.log('onSelect', e) + }, + onTap(e) { + this.setData({ + select:!this.data.select + }) + }, getCitys() { const _this = this qqmapsdk.getCityList({ diff --git a/tools/demo/example/index-list/index-list.wxml b/tools/demo/example/index-list/index-list.wxml index 1621ff2..cd75899 100644 --- a/tools/demo/example/index-list/index-list.wxml +++ b/tools/demo/example/index-list/index-list.wxml @@ -1,11 +1,13 @@ - + Index List 类通讯录列表 + 可选择状态： + diff --git a/tools/demo/project.config.json b/tools/demo/project.config.json index aab1a17..8bd24b6 100644 --- a/tools/demo/project.config.json +++ b/tools/demo/project.config.json @@ -4,7 +4,6 @@ "ignore": [] }, "setting": { - "urlCheck": true, "es6": true, "postcss": true, "minified": true, @@ -13,7 +12,6 @@ }, "compileType": "miniprogram", "libVersion": "2.9.4", - "appid": "wxe0b5580bba739b69", "projectname": "小程序拓展组件库", "isGameTourist": false, "condition": {