vue2无法使用vue-email-editor

问题描述 投票:0回答:1

我参考官网安装vue-email-editor

unlayer vue-email-editor组件链接

得到这个错误

vue.runtime.esm.js?c320:4573 [Vue warn]: 渲染错误:“TypeError: (0 , external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock) is not a function”

TypeError: (0 , external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock) 不是函数 在 Proxy.EmailEditorvue_type_template_id_eb864766_scoped_true_render (vue-email-editor.common.js?8479:21986:1)

未捕获的错误:找不到给定 id 或 className 的有效元素。

我该怎么办?谢谢,如果有任何解决方案!

更新:

在 npm install vue-email-editor --save 之后

app.vue:

<template>
  <div id="app">
    <h2>unlayer</h2>
    <div class="container">
      <div id="bar">
        <h1>Vue Email Editor (Demo)</h1>

        <button v-on:click="saveDesign">Save Design</button>
        <button v-on:click="exportHtml">Export HTML</button>
      </div>

      <EmailEditor ref="emailEditor" v-on:load="editorLoaded" />
    </div>
  </div>
</template>

<script>
import { EmailEditor } from 'vue-email-editor';
import sample from './data/sample.json';

export default ({
  components: {
    EmailEditor,
  },
  data() {
    return {
    };
  },
  methods: {
    editorLoaded() {
      // Pass your template JSON here
      // this.$refs.emailEditor.editor.loadDesign({});
      console.log('editorLoaded');
      this.$refs.emailEditor.editor.loadDesign(sample);
    },
    saveDesign() {
      this.$refs.emailEditor.editor.saveDesign(
        (design) => {
          console.log('saveDesign', design);
        },
      );
    },
    exportHtml() {
      this.$refs.emailEditor.editor.exportHtml(
        (data) => {
          console.log('exportHtml', data);
        },
      );
    },
  },
});
</script>

<style lang="scss">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;}
</style>

更新2:

我将安装 vue-email-editor 从 @2.0.0 更改为 @0.7.2 然后解决问题 但我不知道最新版本有什么问题

javascript vue.js email vuejs2 editor
1个回答
0
投票

检查版本,因为版本

^2.0.0
适用于Vue 3,版本
^1.0.0
适用于Vue 2,所以你需要运行
npm i vue-email-editor@^1.0.0
但记住你需要卸载最后一个版本。

就这样做

rm -r node_modules
,然后
npm i vue-email-editor@^1.0.0
,最后
npm install
,也许就解决了

© www.soinside.com 2019 - 2024. All rights reserved.