美文网首页
Vue 键盘事件及键值修饰符(alt:enter)、双向数据绑定

Vue 键盘事件及键值修饰符(alt:enter)、双向数据绑定

作者: 祝名 | 来源:发表于2018-12-24 18:19 被阅读0次

    一.键盘事件及键值修饰符(alt:enter)

    1.键盘事件keyup,只要按键就会触发相应函数。

    2.keyup后面接的修饰符enter表示,只有按下enter键才会触发对应函数。

    3.修饰符可添加多个,接enter和alt修饰符表示,同时按下alt和enter键才会触发。


    二.双向数据绑定

    1. 只能应用于input select textarea

    2. 方法一:input的ref属性可用于标记。键盘事件触发logName方法,通过“this.$refs.ref属性值.value”获取到input中实时输入的数据。将这个数据赋值给vue对象中的(“this.name”)name属性,从而实时修改span标签中的name。实现双向数据绑定


    2. 方法二:v-model,这里v-model获取的name就是vue对象中的name属性,所以vue中的name设置的默认值hello,可以直接附在输入框内。改动input中的输入值,会相应的修改vue中的name属性,从而修改span标签中的那么。实现双向数据绑定


    相关文章

      网友评论

          本文标题:Vue 键盘事件及键值修饰符(alt:enter)、双向数据绑定

          本文链接:https://www.haomeiwen.com/subject/lgnakqtx.html