Component({
    options: {
        // 允许外部样式影响组件
        styleIsolation: 'apply-shared'
    },

    properties: {
        name: {
            type: String,
            value: '',
            required: true
        },
        size: {
            type: String,
            value: ''
        },
        index: {
            type: Number,
            value: 0
        },
        extClass: {
            type: String,
            value: ''
        }
    },

    observers: {
        // 自动补全单位（数字默认加rpx）
        'size': function(val) {
            if (!val) return
            this.setData({
                formattedSize: /\d$/.test(val) ? `${val}rpx` : val
            })
        }
    },

    data: {
        formattedSize: ''
    },

    methods: {
        handleClick() {
            this.triggerEvent('click', { index: this.properties.index })
        }
    }
})