From d0ba3b58991e1be054a45ac914119916eb76c5fe Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Thu, 11 Nov 2021 11:22:50 +0800 Subject: [PATCH] 优化跨端通讯接收API --- forms/select/CSelect.vue | 62 +++++++++++++++++++++++++++++-- 1 files changed, 58 insertions(+), 4 deletions(-) diff --git a/forms/select/CSelect.vue b/forms/select/CSelect.vue index eb3e4d2..e8547c6 100644 --- a/forms/select/CSelect.vue +++ b/forms/select/CSelect.vue @@ -6,6 +6,7 @@ <template> <view class="c-select"> <picker + v-if="!selectByPage" mode="selector" :range="options" :value="current" @@ -17,6 +18,7 @@ :name="itemRes.name" :title="itemRes.label" :required="itemRes.required" + :disabled="itemRes.disabled" :error="itemRes.error" :placeholder="placeholder" :value="selected" @@ -24,11 +26,29 @@ <view class="at-icon at-icon-chevron-right" /> </AtInput> </picker> + <view + v-else-if="selectByPage.length > 5" + @tap="evt => onGoToSelectorPage()" + > + <AtInput + :name="itemRes.name" + :title="itemRes.label" + :required="itemRes.required" + :disabled="itemRes.disabled" + :error="itemRes.error" + :placeholder="placeholder" + :value="choose.name" + > + <view class="at-icon at-icon-chevron-right" /> + </AtInput> + </view> </view> </template> <script> +import Taro from '@tarojs/taro'; import { AtInput } from 'taro-ui-vue'; +import { $pagePoster } from '@components/common/PagePoster'; import './cSelect.scss'; export default { @@ -37,12 +57,24 @@ AtInput, }, props: { - options: Array, - placeholder: String, + // 表单数据资源(表单组件内部机制专用) itemRes: Object, + // 选择菜单选项(浮窗模式) + options: Array, + // 占位提示 + placeholder: String, + // 开启选择菜单跳转选择页面模式,并指定功能页面 + selectByPage: String, + // 页面模式下,选择完成后的回调 + onSelectFromPage: Function, }, data() { - return {}; + return { + choose: { + name: '', + value: null, + }, + }; }, computed: { optionKey() { @@ -72,7 +104,29 @@ const item = this.options[evt.value]; this.itemRes.onChange(item[this.optionKey]); }, + onGoToSelectorPage() { + let url = this.selectByPage; + if (this.selectByPage.indexOf('?') > 0) { + url += '&mode=CSelect'; + } else { + url += '?mode=CSelect'; + } + if (this._eventor) { + // 销毁上次事件收发器 + this._eventor.destroy(); + } + this._eventor = $pagePoster.createEventor(); + this._eventor.on('@linked', () => { + this._eventor.emit('lastValue', this.choose.value); + }); + this._eventor.on('selected', data => { + this.choose.name = data.name; + this.choose.value = data.value; + this.itemRes.onChange(data.value); + this.onSelectFromPage && this.onSelectFromPage(data.value); + }); + Taro.navigateTo({ url: url + '&eventorId=' + this._eventor.id }); + }, }, - mounted() {}, }; </script> \ No newline at end of file -- Gitblit v1.9.1