Vue官网教程学习过程中一些值得记录的东西
时间:2023-03-31 12:41:22
CSS
今天在官网的学习过程中看到一件很有意思的事情。具体效果如下图所示。html代码如下
{{index}}{{item.something}}
js代码如下varapp=newVue({el:"#app",data(){return{content:'',datalist:[{id:0,something:'赵希娜'},{id:1,something:'JhonSena'},{id:2,something:'visualstudiocode'},],nextId:3,}},methods:{addlist(){this.datalist.push({id:this.nextId++,something:this.content})this.content=''},remove(index){this.datalist.splice(index,1)console.log(index)}},created(){varlett=this;文档。onkeydown=function(e){varkey=window.event.keyCode;if(key==13){lett.addlist();}}},})其中官网提到一个keymodifier是监听keyboardevent,我们经常需要检查commonkey-values。Vue允许在监听键盘事件时为v-on添加一个键修饰符。我在代码中添加了@keyup.enter。但是,按回车键是没有用的。您必须先获得焦点,然后才能按键触发它。当然,百度解决方法是添加一个键盘事件created(){varlett=this;document.onkeydown=function(e){varkey=window.event.keyCode;如果(键==13){让。添加列表();}}},没关系