textarea 按 Enter 提交，Shift + Enter 换行

<template>
  <div>
    <textarea
      v-model="message"
      @keydown.enter="handleEnter"
      placeholder="按 Enter 提交，Shift + Enter 换行"
    ></textarea>
    <button @click="submitMessage">提交</button>
    <p>输入内容：{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: "",
    };
  },
  methods: {
    handleEnter(event) {
      if (!event.shiftKey) {
        event.preventDefault(); // 阻止默认换行行为
        this.submitMessage();
      }
      // 如果是 Shift + Enter，浏览器将自动处理换行，不需要干预
    },
    submitMessage() {
      if (this.message.trim()) {
        alert("提交的信息: " + this.message);
        this.message = ""; // 清空文本框
      } else {
        alert("请输入内容后再提交！");
      }
    },
  },
};
</script>

<style>
textarea {
  width: 100%;
  height: 100px;
}
</style>

说明

• if (!event.shiftKey)：检查是否未按下 Shift，如果仅按下 Enter，则阻止换行并触发提交。
• Shift + Enter：浏览器默认处理换行，无需手动干预。