intelligent-form

intelligent-form

说明

1. 使用场景：pc端房颤医生随访记录、小程序房颤医生随访记录、pc端用户中心随访方案创建编辑
2. 每个输出的组件所对应的文件 IntGroupWidgetPreview ---> widgets/FormGroupWidgetPreview IntSettingPageRender ---> settings/FormPageWidget IntWidgetSetting ---> settings/FormWidgetSetting IntWidget ---> widgets/FormWidget IntWidgetPreview ---> widgets/FormPageWidgetPreview

npm 安装

npm i intelligent-form

使用说明

你可以引入整个intelligent-form，也可进行按需加载组件

1. 完整引入 在 main.js 中写入以下内容：

import Vue from 'vue';
import IntForm from 'intelligent-form';
import '/intelligent-form/lib/theme-chalk.css';
import App from './App.vue';

Vue.use(IntForm);

new Vue({
  el: '#app',
  render: h => h(App)
});

2. 按需引入 借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。

    然后，将 .babelrc 修改为：

{
  "plugins": [
    [
      "component",
      {
        "libraryName": "intelligent-form",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

在 main.js 中写入以下内容：

import Vue from 'vue';
import {
  IntGroupWidgetPreview,
  IntSettingPageRender,
  IntWidget,
  IntWidgetPreview,
  IntWidgetSetting
} from 'intelligent-form';
import App from './App.vue';

Vue.use(IntWidgetSetting);
Vue.use(IntGroupWidgetPreview);
Vue.use(IntSettingPageRender);
Vue.use(IntWidgetPreview);
Vue.use(IntWidget);

new Vue({
  el: '#app',
  render: h => h(App)
});