需求如下:

textarea中,输入回车键时添加分号

分析需求,分下面几步

  1. 阻止默认回车换行
  2. 获取值并添加分号
<!-- 此处使用了Vue语法中的事件修饰符 keydown.enter -->
<!-- 使用keyup阻止默认事件不起作用 -->
<div id="app">
<textarea v-mode="text" @keydown.enter="submit"></textarea>
</div>


<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script>
	new Vue({
    el: 'app',
    data(){
      return {text: ""}
    },
    methods:{
      submit(e){
        // 浏览器阻止默认事件兼容
        if (e.preventDefault) e.preventDefault();
        else window.event.value = false;
        // 修改值
        let _ = this.text;
        if (_.charAt(_.length-1) === ";") return
        else this.text += ";"
      }
    }
  })
</script>
Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐