无法从父组件中检索 TinyMCE 的内容

Question

我已经在他们的 Github 上问过这个问题，但到目前为止还没有答案，所以我在这里试试运气。

我正在创建一个包含 TinyMCE 作为组件的表单； 我的目标是能够通过整个网站作为主要的所见即所得来使用和重用这个组件。 我导入它，给它一个v-model ，我很高兴。

因此，它“有效”，例如，我可以通过v-model设置一个值，TinyMCE 会很好地显示它。 但是，看起来我处于只写模式，因为我无法从中提取当前数据。

我最初为 Github 问题创建了一个示例，您可以在此处查看它，以便您对我所面临的问题有一个很好的了解。 TinyMCE 组件下有一个 textarea 具有相同的 v-model，只需尝试使用它并查看行为。

虽然如果我在 TinyMCE 组件中声明一个 v-model 一切正常，但我需要做什么才能将我的值传递给父组件？

提前致谢

Answer 1

您也需要在编辑器本身上使用v-model ，否则它只接收父值但无法更新它。 但是，您不能为此使用 prop value ，因为 props can't be mutated 。

在这里使用带有v-model的计算设置器是一个很好的解决方案：

<editor
  api-key="qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc"
  v-model="model"
></editor>

保持value属性不变并添加计算：

computed: {
  model: {
    get() {
      return this.value;
    },
    set(val) {
      this.$emit('input', val);
    }
  }
}

计算的 setter 在获取时返回 prop，但发出而不是设置它。