Javascript Vue.js v-html contenteditable防止dom刷新以防止光标/插入符号跳转

作为参考，我使用Vue 2.0、Vuex和Firebase

我正在使用v-html绑定构建一个contenteditable组件来呈现innerHTML。数据在KeyUp上更新。每当数据被更新时，DOM元素就会用“新”数据刷新，导致插入符号/光标跳回contenteditable div的开头

我已经研究了Rangy和其他几个stackoverflow解决方案，但我觉得最简单的解决方案是从数据刷新中解除DOM元素的绑定。我希望数据仍在firebase中更新，但不会导致元素刷新

有没有办法让我仍然使用v-html，但不让DOM元素用数据刷新？或者有没有其他方法可以在没有自动绑定的情况下呈现HTML

编辑：2016年11月18日

所以我一直在努力解决这个问题。以下是我目前的想法

使用并停止组件重新渲染。我已经查看了Vue文档，但似乎找不到什么东西可以停止这个循环

使用类似于。同样，Vue.js在生命周期中似乎没有类似的方法

如果有人知道结束生命周期、停止重新渲染或从vue中获取React的“componentShouldRender”功能的任何方法，这就足以解决此问题

-

更新：2016年11月29日

这个更新来得有点晚。我在Github上用Vue登录了一个

在这个问题的讨论中，有几个JSFIDLE可以提供一个解决方案。然而，我认为没有一个是完整的解决方案。唯一有希望的一个最近已经产生了

如果添加

组件shouldRender

生命周期挂钩，所有这些问题都不会成为问题。我将继续寻找一个完整的解决方案

有没有办法让我仍然使用v-html，但不让DOM元素用数据刷新

对。

v-once

指令正是这样做的

---

make jsfiddle plsserching对于一个小问题，我在文档中发现了这个问题：显然，您可以在v-model指令中添加：lazy，以便模型仅在发生更改事件时更新。这不完全是你想要的，但它可能会帮助你处理it@lkostka它实际上是

.lazy

。但是我没有做任何改变就尝试了：/brrrrrr然后我不知道，我想您必须在那里插入一些自定义事件管理。希望更聪明的人能发布一个解决方案。如果它是一个输入，我建议在使用一些生命周期挂钩刷新dom后重新关注。不确定“可编辑div”是什么意思。