vue 中contenteditable="true"添加可编辑属性后v-model双向绑定失效的解决办法

Posted 2022-09-04 zhoushuang0426

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue 中contenteditable="true"添加可编辑属性后v-model双向绑定失效的解决办法相关的知识，希望对你有一定的参考价值。

在项目中会遇到需要编辑单元格的双向绑定问题,v-model双向绑定会在添加contenteditable="true"属性后失效
解决方法如下,亲测好用(v-html和@blur实现):

<td class="width90" contenteditable="true" v-html="name3.LastProduct" @blur="name3.LastProduct=$event.target.innerText"></td>

完美好用!

以上是关于vue 中contenteditable="true"添加可编辑属性后v-model双向绑定失效的解决办法的主要内容，如果未能解决你的问题，请参考以下文章