vue+element form的封装

目前正在做的一个项目 因为页面搜索表单是一样的 所以想要封装一个表单组件

直接上代码了

引入并注册组件

import searchForm from "@/components/searchForm";

components: {
    searchForm
  },

在页面中使用是这样的

data() {
  return{
    formConfig: {
        formItemList: [
          {
            type: "month",
            dateFormate: 'yyyy-MM',
            prop: "month",
            label: "统计月",
            placeholder: "统计月"
          },
          {
            type: "select",
            prop: "org",
            label: "运营商",
            placeholder: "运营商",
            optList: []
          },
          {
            type: "date",
            prop: "startTime",
            dateFormate: 'yyyy-MM-dd',
            label: "承诺启用时间",
            placeholder: "承诺启用时间"
          },
          {
            type: "date",
            prop: "endTime",
            dateFormate: 'yyyy-MM-dd',
            label: "承诺停用时间",
            placeholder: "承诺停用时间"
          },
          {
            type: "select",
            prop: "direction",
            label: "话务方向",
            placeholder: "话务方向",
            optList: []
          }
        ],
        operate: [
          {
            icon: "el-icon-search",
            type: "primary",
            name: '查询',
            handleClick: this.search
          }
        ]
      },
      form: {
      },
   }
},

methods: {
  search() {
      console.log(this.form)
    }
}