模仿微信enter发送 ctrl+enter 换行
template 核心是@keyup.enter.exact 和 @keyup.ctrl.enter
<textarea
v-if="message.contentType === 1"
@keyup.enter.exact="sendMessage"
@keyup.ctrl.enter="lineFeed()"
class="text scroll"
cols="30"
rows="10"
maxlength="1000"
autofocus
required
v-model="textContent"
></textarea>
js
export default {
data () {
return {
textContent: ''
}
},
methods: {
// 发送消息
sendMessage () {
// 业务逻辑省略
},
// 换行
lineFeed () {
console.log('换行')
console.log(this.textContent)
this.textContent = this.textContent + '\n'
}
}
}
遇到的坑
- textarea 必须获取焦点快捷键才会生效
- enter 需要加exact 不然按ctrl+enter 也会触发enter