2021年11月15日

vue学习--- v-once指令(初次动态渲染后，就视为静态内容)

摘要： v-once指令： 1.v-once所在节点在初次动态渲染后，就视为静态内容了。 2.以后数据的改变不会引起v-once所在结构的更新，可以用于优化性能。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>v-once指令</ 阅读全文

posted @ 2021-11-15 08:13 leiyanting 阅读(123) 评论(0) 推荐(0) 编辑

vue学习---v-cloak指令(解决网速慢时页面展示出{{xxx}}的问题)

摘要： v-cloak指令（没有值）： 1.本质是一个特殊属性，Vue实例创建完毕并接管容器后，会删掉v-cloak属性。 2.使用css配合v-cloak可以解决网速慢时页面展示出{{xxx}}的问题。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" 阅读全文

posted @ 2021-11-15 08:02 leiyanting 阅读(168) 评论(0) 推荐(0) 编辑

vue学习---v-html指令与安全问题

摘要： v-html指令： 1.作用：向指定节点中渲染包含html结构的内容。 2.与插值语法的区别： (1).v-html会替换掉节点中所有的内容，{{xx}}则不会。 (2).v-html可以识别html结构。 3.严重注意：v-html有安全性问题！！！！ (1).在网站上动态渲染任意HTML是非常危阅读全文

posted @ 2021-11-15 07:32 leiyanting 阅读(1070) 评论(0) 推荐(0) 编辑

2021年11月14日

vue学习---v-text指令(向其所在的节点中渲染文本内容)

摘要：学过的指令： v-bind : 单向绑定解析表达式, 可简写为 :xxx v-model : 双向数据绑定 v-for : 遍历数组/对象/字符串 v-on : 绑定事件监听, 可简写为@ v-if : 条件渲染（动态控制节点是否存存在） v-else : 条件渲染（动态控制节点是否存存在） v-s 阅读全文

posted @ 2021-11-14 19:56 leiyanting 阅读(459) 评论(0) 推荐(0) 编辑

vue学习---过滤器Vue.filter / {{ xxx | 过滤器名}}

摘要：过滤器：定义：对要显示的数据进行特定格式化后再显示（适用于一些简单逻辑的处理）。语法： 1.注册过滤器：Vue.filter(name,callback) 或 new Vue{filters:{}} 2.使用过滤器：{{ xxx | 过滤器名}} 或 v-bind:属性 = "xxx | 过滤器阅读全文

posted @ 2021-11-14 19:52 leiyanting 阅读(89) 评论(0) 推荐(0) 编辑

vue学习---收集表单数据/v-model的三个修饰符

摘要：收集表单数据：若：<input type="text"/>，则v-model收集的是value值，用户输入的就是value值。若：<input type="radio"/>，则v-model收集的是value值，且要给标签配置value值。若：<input type="checkbox"/> 阅读全文

posted @ 2021-11-14 17:21 leiyanting 阅读(105) 评论(0) 推荐(0) 编辑

vue学习---数据监视总结

摘要： Vue监视数据的原理： 1. vue会监视data中所有层次的数据。 2. 如何监测对象中的数据？通过setter实现监视，且要在new Vue时就传入要监测的数据。 (1).对象中后追加的属性，Vue默认不做响应式处理 (2).如需给后添加的属性做响应式，请使用如下API： Vue.set(ta 阅读全文

posted @ 2021-11-14 16:35 leiyanting 阅读(87) 评论(0) 推荐(0) 编辑

vue学习---Vue.set添加数据

摘要：当我们使用vue开发时经常会遇到当vue实例已经创建好了，有时候需要再次给数据赋值时，并不能在视图中改变在vue文档中写着如果在实例创建之后添加新的属性到实例上，它不会触发视图更新因此比如我们修改一个数组其中的一个值，或者添加一条数据时，不管用。 <div id="app"> <p v-for="i 阅读全文

posted @ 2021-11-14 15:08 leiyanting 阅读(578) 评论(0) 推荐(0) 编辑

vue学习---列表排序

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>列表排序</title> <script type="text/javascript" src="../js/vue.js"></script> </head> <body> 阅读全文

posted @ 2021-11-14 11:36 leiyanting 阅读(209) 评论(0) 推荐(0) 编辑

vue学习---列表过滤

摘要： <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>列表过滤</title> <script type="text/javascript" src="../js/vue.js"></script> </head> <body> 阅读全文

posted @ 2021-11-14 11:04 leiyanting 阅读(95) 评论(0) 推荐(0) 编辑

导航

2021年11月15日

2021年11月14日