xl-editor

xl-editor

安装

npm install xl-editor -S

使用教程

<template>
  <div class="home">
    <XlEditor
      ref="editor"
      v-model="msg"
      :disabled="disabled"
      :height="height"
      :width="width"
      :action="action"
      @onClick="onClick"
    />

    <xl-button type="primary" @click="clear">清空内容</xl-button>
    <xl-button type="primary" @click="disabled = true">禁用</xl-button>
  </div>
</template>
<script>
import  XlEditor  from 'xl-editor'

export default {
  name: 'Home',
  components: {
    XlEditor
  },
  data() {
    return {
      msg: 'Welcome to Use XL Editor',
      width: 960,
      height: 600,
      disabled: false,
      action: 'http://localhost:3000/upload/single'
    }
  },
  methods: {
    // 鼠标单击的事件
    onClick(e, editor) {
      console.log('Element clicked')
      console.log(e)
      console.log(editor)
    },
    // 清空内容
    clear() {
      this.$refs.editor.clear()
    }
  }
}
</script>