富文本框

本文使用的是第三方富文本组件 vue2-editor

效果

vue2-editor

安装

Node

  1. npm install vue2-editor

浏览器

  1. <script src="https://unpkg.com/quill/dist/quill.min.js"></script>
  2. <script src="https://unpkg.com/vue2-editor/dist/vue2-editor.umd.js"></script>

导入

Node

  1. import { VueEditor } from "vue2-editor";

浏览器

  1. var VueEditor = window.Vue2Editor.VueEditor;

挂载

  1. Vue.use(VueEditor);
  2. //或者
  3. Vue.component('vue-editor', VueEditor);
  4. //或者
  5. formCreate.component('vue-editor', VueEditor);

生成

  1. $f = formCreate.create([
  2. {
  3. type:'vue-editor',
  4. title:'商品详情',
  5. field:'editor',
  6. value:'<h1>form-create</h1>'
  7. }
  8. ])