vue中如何在watch监听中新增tinymce的撤销？

  • Z时代
  • 2024-02-27
  • 分类：IT

tinymce.undoManager.add()
tinymce.undoManager.transact()

我知道以上两个命令是记录用户操作用于回滚的方法
在我的项目中需要监听 App.vue 传递过来的值从而替换编辑器中的展示的文档（dom）
所以我将 tinymce 运行在了 watch 中，代码如下：

<script setup>
import tinymce from 'tinymce/tinymce' // tinymce 默认 hidden，不引入则不显示编辑器
import Editor from '@tinymce/tinymce-vue'
watch(() => {
  return props.propChild
}, (val) => {
  console.log('子组件接收', val)
  switch (val.edit) {
    case 'click':
      tinymce.activeEditor.getBody().querySelector('#' + val.id).scrollIntoView()
      break
    case 'edit':
      tinymce.activeEditor.getBody().querySelector('#' + val.id).innerText = val.idName
      tinymce.undoManager.add()
      // tinymce.undoManager.transact()
      break
  }
}, {
  deep: true
})
</script>

但是在项目运行后，页面报错

tinymce.activeEditor.getBody().querySelector('#' + val.id).scrollIntoView() // 可以执行
tinymce.activeEditor.getBody().querySelector('#' + val.id).innerText = val.idName // 可以执行
tinymce.undoManager.add() // TypeError: Cannot read properties of undefined (reading 'add')
tinymce.undoManager.transact() // TypeError: Cannot read properties of undefined (reading 'transact')

请问是为什么呢？

回答：

经查询，实际节点应该是 tinymce.activeEditor.undoManager

回答：

错误不是已经说明了——tinymce.undoManager是undefined;
你大小写错了吧，UndoManager
vue中如何在watch监听中新增tinymce的撤销？

以上是 vue中如何在watch监听中新增tinymce的撤销？ 的全部内容， 来源链接： utcz.com/p/935335.html

回到顶部