Vue
知识点总结
FHB1000
这个作者很懒,什么都没留下…
展开
-
自定义指令
自定义一个全局指令 定义了一个获得焦点的指令(没有值的属性) Vue.directive('focus', { inserted: function(el) { // el表示指令锁绑定的元素 el.focus(); } }); 使用该指令 <input type="text" v-focus> 定义了一个改变文本框颜色的指令(有值...原创 2020-04-30 18:01:49 · 126 阅读 · 0 评论 -
将数据双向绑定到表单控件中
数据准备 var vm = new Vue({ el:'#app', data: { uname :'lisi', sex :'男', hobby: ['sing','ppp'], job :[1,3] desc: '我牛逼va' } }) 单行文本框 传入一个字符串 姓名: <input type="text" v-model="uname"> 单选框 ...原创 2020-04-30 17:48:08 · 197 阅读 · 0 评论 -
分支循环结构
分支结构 v-if v-else v-else-if 控制元素是否显示到dom中 v-show v-if 和v-show的区别 v-if是通过判断 来在dom树中添加删除结点 <div id="app"> <div v-show='score==100'>满分</div> <div v-if='score>=90'&...原创 2020-04-30 17:30:25 · 162 阅读 · 0 评论 -
指令及其使用
什么是指令 ? 指令就是自定义属性 v-clock 解决插值表达式的闪动问题 在插值所在的标签上添加一个自定义属性 v-clock <div v-clock> {{msg}} </div> 在样式中设置 [v-clock]{ display:none } 原理:先通过样式隐藏内容 然后在内存中进行值的替换 替换号之后再显示最终结果 v-text 填充文本 将msg的内...原创 2020-04-30 15:54:31 · 452 阅读 · 0 评论