hy-components

基于view-design UI封装的复合组件

install

npm i hy-components

components

FormSchema

表单片段生成器

• Usage

HTML

<Form>
  <FormSchema v-model="form" :schema="schema" @name-on-change="cb" ></FormSchema>
</Form>

Javascript

import { FormSchema } from 'hy-components'

export default {
  components: { FormSchema },
  data() {
    return {
      form: {},
      schema: [
        { type: 'i-input', label: '姓名', prop: 'name', children: h => [h('span', { slot: 'append' }, '先生')], emit: ['on-change'], rules: [{ required: true, message: '请填写姓名', trigger: 'blur' }] },
        { type: 'radio-group', label: '性别', prop: 'sex', groups: [{ label: '男', value: 0 }, { label: '女', value: 1 }] },
        { type: 'checkbox-group', label: '爱好1', prop: 'like1', groups: [{ label: '游戏', value: 0 }, { label: '看书', value: 1 }] },
        { type: 'i-select', label: '爱好2', prop: 'like2', groups: [{ label: '游戏', value: 0 }, { label: '看书', value: 1 }] },
        { type: 'date-picker', label: '出生日期', prop: 'birthday', col: { span: 6 }, emit: ['on-change', 'on-open-change'] },
        { type: 'time-picker', label: '出生时间', prop: 'birthtime', col: { span: 6 } },
        { type: 'auto-complete', label: '自动完成', prop: 'ac', props: { data: ['小新', '奥特曼', '奥里给'] } },
      ],
    }
  },
  methods: {
    cb(arg1, arg2) {
      console.log(arg1)
    },
  },
}