在vue-component中使用vue-html-editor

Question

所以我想在我的页面的vue-component中使用vue-html-editor但它不起作用.我是vue和vue组件的新手,所以我认为这应该是一项简单的任务,但不知怎的,我很蠢到要把它弄好.

我的组件:

<template>
  <div class="container">
    <vue-html-editor name="html-editor" :model.sync="text"></vue-html-editor>
    <div style="margin-top:40px">
      <div> The HTML contents are as follows:</div>
      <hr>
      <div>{{ text }}</div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'Edit',
    components: {
      "vue-html-editor": require("vue-html-editor")
    },
    data() {
      return {
        text: 'Start writing your notes here...'
      }
    }
  }

</script>

<style scoped>


</style>

和控制台错误消息:

vue.esm.js?efeb:591 [Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <VueHtmlEditor>
       <Edit> at src/components/Edit.vue
         <App> at src/App.vue
           <Root>

我已经安装了vue-html-editor但我认为我没有正确加载编辑器.

任何帮助表示赞赏.提前致谢!

Answer 1

看看vue-html-editor github提交页面,我看到最后一次更新是从2年前开始的.vue-html-editor与Vue 1.0兼容,但可能不适用于最新版本.但是,如果你继续遇到vue-html-editor的问题,也许值得尝试vue-quill-editor.我发现它很容易实现,文档非常好.

https://github.com/surmon-china/vue-quill-editor