Component({
    options: {
        // multipleSlots: true, // 在组件定义时的选项中启用多slot支持
    },
    /**
     * 组件的属性列表
     */
    properties: {
        width: {
            type: String,
            value: '', // 按钮宽度
        },
        placeholder: {
            type: String,
            value: '请输入文字',
        },
        value: {
            type: String,
            value: '', // 输入框的值（支持外部控制）
        },
    },
    /**
     * 组件的初始数据
     */
    data: {
        innerValue: '', // 内部维护的输入值
    },
    observers: {
        // 监听外部传入的 value 变化
        value(newVal: string) {
            this.setData({ innerValue: newVal });
        },
    },
    lifetimes: {
        attached() {
            // 初始化时同步外部传入的 value
            this.setData({ innerValue: this.properties.value || '' });
        },
    },
    /**
     * 组件的方法列表
     */
    methods: {
        onInput(e: WechatMiniprogram.Input) {
            let { value } = e.detail;
            value = value.replace(/\s/g, '');
            this.setData({ innerValue: value });
        },

        onConfirm() {
            const value = this.data.innerValue;

            // 触发确认事件（即使值为空也触发，让父组件处理清空逻辑）
            this.triggerEvent('onConfirm', { value });
        },

        // onTap() {
        //     this.triggerEvent('onTap', { words: (this as any).words });
        // },
    },
});
