mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-05 19:41:45 +08:00
71 lines
2.2 KiB
JavaScript
71 lines
2.2 KiB
JavaScript
import { VantComponent } from '../common/component';
|
|
VantComponent({
|
|
field: true,
|
|
relation: {
|
|
name: 'dropdown-menu',
|
|
type: 'ancestor',
|
|
linked(target) {
|
|
this.parent = target;
|
|
},
|
|
unlinked() {
|
|
this.parent = null;
|
|
}
|
|
},
|
|
props: {
|
|
value: null,
|
|
title: String,
|
|
disabled: Boolean,
|
|
titleClass: String,
|
|
options: {
|
|
type: Array,
|
|
value: []
|
|
}
|
|
},
|
|
data: {
|
|
transition: true,
|
|
showPopup: false,
|
|
showWrapper: false,
|
|
displayTitle: ''
|
|
},
|
|
created() {
|
|
this.setData({ displayTitle: this.computedDisplayTitle(this.data.value) });
|
|
},
|
|
methods: {
|
|
computedDisplayTitle(curValue) {
|
|
const { title, options } = this.data;
|
|
if (title) {
|
|
return title;
|
|
}
|
|
const match = options.filter(option => option.value === curValue);
|
|
const displayTitle = match.length ? match[0].text : '';
|
|
return displayTitle;
|
|
},
|
|
onClickOverlay() {
|
|
this.toggle();
|
|
this.$emit('close');
|
|
},
|
|
onOptionTap(event) {
|
|
let { value, displayTitle } = this.data;
|
|
const { option } = event.currentTarget.dataset;
|
|
const { value: optionValue } = option;
|
|
if (optionValue !== value) {
|
|
value = optionValue;
|
|
displayTitle = this.computedDisplayTitle(optionValue);
|
|
this.$emit('change', optionValue);
|
|
}
|
|
this.setData({ showPopup: false, value, displayTitle });
|
|
const time = this.data.duration || 0;
|
|
setTimeout(() => {
|
|
this.setData({ showWrapper: false });
|
|
}, time);
|
|
// parent 中的 itemListData 是 children 上的数据的集合
|
|
// 数据的更新由 children 各自维护,但是模板的更新需要额外触发 parent 的 setData
|
|
this.parent.setData({ itemListData: this.parent.data.itemListData });
|
|
},
|
|
toggle() {
|
|
const { childIndex } = this.data;
|
|
this.parent.toggleItem(childIndex);
|
|
}
|
|
}
|
|
});
|