court-badminton/commpents/picker/index.js

// commpents/picker/index.js
Component({
    /**
     * 组件的属性列表
     */
    properties: {
        label: { type: String },
        model: { type: String },
        columns: { type: Array },
        value: {
            type: String,
            observer: function (val) {
                this.initData()
            }
        },
        valueKey: { type: String, value: 'value' },
        labelKey: { type: String, value: 'label' }
    },

    /**
     * 组件的初始数据
     */
    data: {
        text: '请选择',
        show: false,
    },

    /**
     * 组件的方法列表
     */
    methods: {
        initData() {
            const val = this.properties.value
            if (!val) return;
            const res = this.properties.columns.find(f => f[this.properties.valueKey] === val)
            if (!res) return;
            const label = res[this.properties.labelKey]
            this.setData({ text: label })
        },
        onChange(event) {
            const obj = event?.detail?.value;
            const label = obj[this.properties.labelKey]
            const value = obj[this.properties.valueKey]
            this.setData({ text: label })
            this.triggerEvent('selected', { value, model: this.properties.model })
            this.toClose();
        },
        toOpen() {
            this.setData({ show: true })
        },
        toClose() {
            this.setData({ show: false })
        }
    }
})