当用户按下键盘上的 Enter 键时,我们希望触发提交评论的动作,可以通过 Vue 中的事件修饰符和事件监听来实现。假设你有一个文本框输入评论,并希望按下 Enter 键触发提交操作,示例代码如下:

<template>
  <div>
    <input v-model="comment" @keyup.enter="submitComment" placeholder="输入评论并按 Enter 提交">
  </div>
</template>

<script>
export default {
  data() {
    return {
      comment: ''
    };
  },
  methods: {
    submitComment() {
      // 在这里调用名为 storeComment 的方法提交评论
      this.storeComment(this.comment);
      // 提交后清空评论框
      this.comment = '';
    },
    storeComment(comment) {
      // 实际提交评论的操作,可以在这里发送请求等
      console.log('提交评论:', comment);
    }
  }
};
</script>

在上面的示例中,@keyup.enter 是事件修饰符,它表示监听键盘事件,并在按下 Enter 键时触发 submitComment 方法。v-model 用于双向绑定评论输入框的内容,并在 submitComment 方法中调用 storeComment 方法来提交评论。

Was this helpful?

0 / 0

发表回复 0

Your email address will not be published.