ivue-material-plus/dist/unplugin-vue-components/es/components/ivue-checkbox-group/index2.mjs.map

A high quality UI components Library with Vue.js

{"version":3,"file":"index2.mjs","sources":["../../../../../src/components/ivue-checkbox-group/index.vue"],"sourcesContent":["<template>\r\n  <div :class=\"wrapperClasses\" :id=\"inputId\">\r\n    <slot></slot>\r\n  </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { computed, defineComponent, ref, provide, watch } from 'vue';\r\n\r\nimport { useFormItem, useFormItemInputId } from '../../hooks';\r\nimport { debugWarn } from '../../utils/error';\r\n\r\n// type\r\nimport { CheckboxContextKey, Props } from './types/checkbox-group';\r\n\r\nconst prefixCls = 'ivue-checkbox-group';\r\n\r\nexport default defineComponent({\r\n  name: prefixCls,\r\n  emits: ['update:modelValue', 'on-change'],\r\n  props: {\r\n    /**\r\n     * 指定当前选中的项目数据。可以使用 v-model 双向绑定数据\r\n     *\r\n     * @type {Array}\r\n     */\r\n    modelValue: {\r\n      type: Array,\r\n      default: () => [],\r\n    },\r\n    /**\r\n     * 输入时是否触发表单的校验\r\n     *\r\n     * @type {Boolean}\r\n     */\r\n    validateEvent: {\r\n      type: Boolean,\r\n      default: true,\r\n    },\r\n  },\r\n  setup(props: Props, { emit }) {\r\n    // 当前值\r\n    const currentValue = ref<any[]>(props.modelValue);\r\n\r\n    // computed\r\n\r\n    // 外部样式\r\n    const wrapperClasses = computed(() => {\r\n      return [`${prefixCls}`];\r\n    });\r\n\r\n    // methods\r\n\r\n    // 改变值\r\n    const handleChange = (value: (string | number)[]) => {\r\n      currentValue.value = value;\r\n\r\n      emit('update:modelValue', value);\r\n      emit('on-change', value);\r\n    };\r\n\r\n    // provide\r\n    provide(CheckboxContextKey, {\r\n      name: prefixCls,\r\n      props,\r\n      handleChange,\r\n    });\r\n\r\n    // 设置表单对应的输入框id\r\n    const { formItem } = useFormItem();\r\n\r\n    // 输入框id\r\n    const { inputId } = useFormItemInputId(props, {\r\n      formItemContext: formItem,\r\n    });\r\n\r\n    // watch\r\n\r\n    // 监听modelValue\r\n    watch(\r\n      () => props.modelValue,\r\n      () => {\r\n        // 输入时是否触发表单的校验\r\n        if (props.validateEvent) {\r\n          formItem?.validate('change').catch((err) => debugWarn(err));\r\n        }\r\n      }\r\n    );\r\n\r\n    return {\r\n      // data\r\n      currentValue,\r\n      inputId,\r\n\r\n      // computed\r\n      wrapperClasses,\r\n    };\r\n  },\r\n});\r\n</script>\r\n"],"names":["_openBlock","_createElementBlock","_normalizeClass"],"mappings":";;;;;AACa,SAAA,YAAA,IAAE,EAAA,MAAA,EAAc,MAAA,EAAA,MAAA,EAAA,OAAA,QAAA,EAAA;EAAO,OAAAA,SAAA,EAAO,EAAAC,kBAAA,CAAA,KAAA,EAAA;AAAA,IAAA,KAAA,EAAAC,cAAA,CAAA,IAAA,CAAA,cAAA,CAAA;AAAA,IACvC,IAAA,IAAA,CAAA,OAAA;AAAA,GAAA,EAAA;AAAA;;;;;;;"}