vue —— vue 富文本(vue2-editor)


npm install vue2-editor --save 安装至项目中

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<template>
  <div>
    <vue2-editor v-model="htmlStr" :editorToolbar="customToolbar"></vue2-editor>
  </div>
</template>
<script>
  import {VueEditor} from 'vue2-editor'
  export default {
    name: 'Vue2Editor',
    data() {
      return {
        htmlStr: '',
        customToolbar: [
          ['bold', 'italic', 'underline'],
          [{'list': 'ordered'}, {'list': 'bullet'}],
          [{'indent': '-""'}, {'indent': '+""'}],
          [{'header': '2'}], ['clean'], [{'align': 'center'}, {'align': 'justify'}, {'align': 'right'}]
        ]
      }
    },
    methods: {},
  }
</script>
<style>
</style>
  • vue2-editor相关配置描述：

在这里插入图片描述

  • vue2-editor事件描述：
    在这里插入图片描述

  • vue2-editor工具栏描述：
    在这里插入图片描述