Vuejs 阻止在内容可编辑中添加新行

Question

如何防止 enter 在内容可编辑的div 中添加新行。 我已经尝试过@keyup.enter.prevent，但它不起作用。 也尝试了@keyup.enter.prevent&@keyup.enter.stop.prevent，但没有运气。

Answer 1

你需要keydown，当你到达keyup事件时，浏览器已经将你按下的任何键插入到输入中。

new Vue({
el: "#app",
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<div id="app">
<div contenteditable="true" @keydown.enter.prevent>edit me</div>
</div>