// 从相对路径 '../common/component' 导入名为 'VantComponent' 的模块，这里假设 'VantComponent' 是一个用于创建特定组件的函数（可能遵循某种组件化规范）
import { VantComponent } from '../common/component';

// 调用 'VantComponent' 函数来创建一个组件，传入一个配置对象，用于定义组件的各种属性、方法等相关信息
VantComponent({
    // 'props' 属性用于定义组件可接收的外部属性（类似 React 中的 props 概念），是一个对象，对象的每个键值对表示一个属性的定义
    props: {
        // 'info' 属性，初始值设置为 null，类型未明确限定（可接收各种类型的值传入）
        info: null,
        // 'name' 属性，限定接收的值类型为字符串类型（String）
        name: String,
        //'size' 属性，限定接收的值类型为字符串类型（String）
        size: String,
        // 'color' 属性，限定接收的值类型为字符串类型（String）
        color: String,
        // 'customStyle' 属性，限定接收的值类型为字符串类型（String）
        customStyle: String,
        // 'classPrefix' 属性，详细定义了其属性类型为字符串类型（type: String），并且设置了默认值为 'van-icon'
        classPrefix: {
            type: String,
            value: 'van-icon'
        }
    },
    //'methods' 属性用于定义组件内部的方法，是一个对象，对象的每个键对应一个方法名，值为对应的方法函数
    methods: {
        // 定义名为 'onClick' 的方法，当组件被点击时可能会触发该方法
        onClick() {
            // 通过 '$emit' 方法（这里假设是基于某种组件框架提供的事件触发机制，比如 Vue 中的自定义事件触发方式）向外触发一个名为 'click' 的自定义事件
            // 这样外部使用该组件的地方可以监听这个 'click' 事件并执行相应的逻辑
            this.$emit('click');
        }
    }
});