Vue官网教程学习过程中值得记录的一些事情

lowett 发布于2019-08-02 12:11 / 2270人阅读

摘要：今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图代码如下标签名例如工作，学习添加标签删除代码如下赵喜娜其中，官网上讲到了一个按键修饰符在监听键盘事件时，我们经常需要检查常见的键值。

今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图

html代码如下


        
            标签名: 
        
        

        
            
               {{index}} {{item.something}}

js代码如下

var app = new Vue({
        el:"#app",
        data(){
            return{
                content:"",
                datalist:[
                    {id:0,something:"赵喜娜"},
                    {id:1,something:"Jhon Sena"},
                    {id:2,something:"visual studio code"},
                ],
                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() {
            var lett=this;
            document.onkeydown=function(e){
                var key=window.event.keyCode;
                if(key==13){
                  lett.addlist();
                }
            }
        },
    })

其中，官网上讲到了一个按键修饰符

在监听键盘事件时，我们经常需要检查常见的键值。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符

我在代码里加上了@keyup.enter 然而，按回车键并没有什么用，要先获得一次焦点以后才能够按键触发，当然也百度到了解决办法，办法就是在created里面添加一个键盘事件

    created() {
            var lett=this;
            document.onkeydown=function(e){
                var key=window.event.keyCode;
                if(key==13){
                  lett.addlist();
                }
            }
        },

就ok了

服务器托管云服务器深度学习的一些应用深度学习的过程机器学习的过程 php存储过程记录集

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/53402.html

Vue官网教程学习过程中值得记录的一些事情

摘要：今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图代码如下标签名例如工作，学习添加标签删除代码如下赵喜娜其中，官网上讲到了一个按键修饰符在监听键盘事件时，我们经常需要检查常见的键值。今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图showImg(https://segmentfault.com/img/bVbkJ3w?w=328&h=134); html代码如下...

flyer_dev 2019-08-23 13:55 评论0 收藏0
Vue官网教程学习过程中值得记录的一些事情

摘要：今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图代码如下标签名例如工作，学习添加标签删除代码如下赵喜娜其中，官网上讲到了一个按键修饰符在监听键盘事件时，我们经常需要检查常见的键值。今天在官网上学习过程中看到了一个挺有趣的东西，具体效果如下图showImg(https://segmentfault.com/img/bVbkJ3w?w=328&h=134); html代码如下...

luxixing 2019-08-29 17:30 评论0 收藏0
B站Up主-山地人-这位老哥2019年的前端自学计划进展如何？——讲一个B站Up主自学前端85天的故

摘要：前言自从上次在掘金发布年山地人的前端完整自学计划讲一个站主山地人的天前端自学故事以来，一眨眼山地人老哥在站做主已经有天了。所以这个体系里的一些框架包括也是山地人年自学计划的一部分。月底，山地人老哥开启了的两个专题。前言自从上次在掘金发布【2019年山地人的前端完整自学计划——讲一个B站UP主山地人的40天前端自学故事】以来，一眨眼山地人老哥在B站做Up主已经有85天了。时隔一个...

cocopeak 2019-08-23 15:36 评论0 收藏0