- 博客(20)
- 收藏
- 关注
RSS订阅原创 display:none和visibility:hidden的区别
我们用最简单的两句话概括：display:none 隐藏元素后，不占位；visibility:hidden 隐藏元素后，占位；display:none示例如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <...
2022-04-02 09:03:36
116
原创 Vue编程式路由API
this.$router.push(path) //相当于点击路由链接（后退1步，会返回当前路由界面）this.$router.replace(path) //用新路由替换当前路由（后退一步，不可返回到当前路由界面）this.$router.back() //后退回上一个记录路由this.$router.go(n) //参数n指定步数this.$router.go(-1) //后返回上一个记录路由this.$router.go(1) //向前进下一个记录路由...
2022-03-14 12:57:21
1465
原创 封装Ajax方法
function ajax(obj){ //创建xml对象 var xml = new XMLHttpRequest(); //判断请求方式 if(obj.method === "get" || obj.method === "GET"){ //GET //判断是否有数据 if(obj.data){ xml.open('GET',obj.url + "?" + obj.data); }e.
2022-03-03 13:11:25
115
原创 Vue中的全局事件总线
1.一种组件间的通信方式，适用于任意组件间通信2.安装全局事件总线：new Vue({....beforeCreate(){Vue.prototype.$bus = this //安装全局事件总线，$bus就是当前应用的vm},....})3.使用事件总线：1.接收数据：A组件想接收数据，则在A组件中给$bus绑定自定义事件，事件的回调留在A组件自身methods(){demo(data){.....}}.....mounted(){this.
2022-03-02 09:34:44
510
原创 Vue中组件的自定义事件
1.一种组件中的通信方式，适用于：子组件===>父组件2.使用场景：A是父组件，B是子组件，B想给A传数据，那么就要在A中给B绑定自定义事件（事件的回调在A中 事件的回调留在父组件中）3.绑定自定义事件：1）第一种方式，在父组件中：<Demo @zidingyi="test"/>或者<Demo v-on:zidingyi="test"/>2）第二种方式，在父组件中：<Demo ref="demo">..............mount.
2022-03-02 09:01:24
330
原创 Math.ceil()、Math.round()、Math.floor()三者的区别
Math.ceil() 上取整Math.round() 四舍五入Math.floor() 下取整
2022-02-07 15:12:57
202
原创 WebStorage浏览器的本地存储
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>L.
2022-02-02 20:37:12
677
原创 ES6中四种数据类型的转换
//类型转换 //Object 与 MAP 转换 let obj = { name:'xiaoming', age:19 } let map = new Map(Object.entries(obj)) //接收键值对 let obj2 = Object.fromEntries(map) console.log('map',map,'obj',obj2); //Array 与 Set 转换 let arr..
2022-01-13 11:09:34
522
原创 Map、Set与Array及Object间的区别
我们通过增删改查来验证Map、Set、Array、Object间的区别具体代码如下：{ let arr = [] let obj = {} let map = new Map() let set = new Set() let item = {fruit:'apple'} //添加 arr.push(item) obj['fruit'] = item.fruit map.set('fruit','apple') set
2022-01-13 11:01:19
430
原创 ES6使用Set方法进行数组去重
在ES6中可以使用Set方法进行数组去重：let arr = [1,1,1,2,2,3,3,3,4,4] let set = new Set(arr) console.log(set);输出结果：Set(4) {1, 2, 3, 4}生成的是一个Set类型而不是一个数组类型，需要我们把他转换成为数组类型 let arr = [1,1,1,2,2,3,3,3,4,4] let set = new Set(arr) console.log(set);
2022-01-13 10:28:34
2831
原创 ES6中的reduce
reduce(function(acc,currentValue,currentIndex){},{})对数组中的每一个元素进行一次回调，升序执行将回调汇总一个返回值1.回到函数 其中有三个参数1） acc：每次回调之后返回值汇总2）currentValue 数组当前进行回调的值3）currentIndex 数组当前进行回调的值得index2.可选参数如果传入acc就是这个值，不传acc就是数组中的第一个值 const str = 'asdadasdasdfaggh'
2022-01-11 11:03:49
159
原创 Vue中vm的生命周期
将要创建 ===> 调用beforeCreate函数创建完毕 ===> 调用 created函数将要挂载 ===> 调用beforeMount函数（重要）挂载完毕 ===> 调用mounted函数 （重要的钩子）将要更新 ===> 调用beforeUpdate函数更新完毕 ===> 调用updated函数（重要）将要销毁 ===> 调用beforeDestory函数 （重要的钩子）销毁完毕 ===> 调用des...
2022-01-07 10:55:33
135
原创 Vue中的过滤器
过滤器：定义：过滤器就是对要显示的数据进行特定格式化再显示（适用于一些简单逻辑的处理）语法：1.注册过滤器：Vue.filter(name,callback) 或 new Vue{filters:{}}2.使用过滤器：{{ xxx | 过滤器名}} 或 v-bing:属性 = " xxx | 过滤器名 "(1)过滤器也可以接受额外参数、多个过滤器也可以串联(2)并没有改变原本的数据，是产生新的对应的数据...
2022-01-05 10:41:28
554
原创 Vue收集表单数据
收集表单数据：（1）若<input type = "text"/>则v-model收集的是value值，用户输入的值就是value值（2）若<input type = "radio"/>则v-model收集的是value值，并且要给标签配置value值（3）若<input type = "checkbox"/>1.没有配置input的value属性，那么收集的就是checked（勾选 or 未勾选 都是布尔值）2.配置inpu
2022-01-05 10:14:49
361
原创 Vue监视数据的原理
1.Vue会监视data中所有层次的数据。2.如何监测对象中的数据？通过setter实现监视，且要在new Vue时就传入要监测的数据。（1）对象中后追加的属性，Vue默认不做响应式处理（2）如需给后添加的属性做响应式，请使用如下API：Vue.set(target, propertyName/index, value) 3.如何监测数组中的数据？通过包裹数组更新元素的方法实现，本质就是做了两件事：（1）调用原生对应的方法对数组进行更新（2）重新解析模板，进而更新页
2022-01-04 16:22:17
88
原创 Vue中常见按键的别名
1.Vue中常用的按键别名:回车 => enter删除 => delete (捕获"删除”和“退格”键)退出 => esc空格 => space换行 => tab上 => up下 => down左 => left右 => right2.Vue未提供别名的按键，可以使用按键原始的key值去绑定，但注意要转为kebab-case（短横线命名）3.系统修饰键（用法特殊）: ctrl、alt、 shift、met...
2021-12-29 10:18:16
1236
原创 Vue中的事件修饰符
Vue中的时间修饰符：1.prevent：阻止默认事件2.stop：阻止事件冒泡3.once：事件只触发一次4.capture：使用事件的捕获模式5.self：只有event.target是当前操作的元素才会触发6.passive：事件的默认行为立即执行，无需等待事件回调执行完毕...
2021-12-29 09:55:47
428
原创 Vue中的MVVM模型
MVVM模型：1.M：模型（Model）：data中的数据2.V：视图（View）：模板代码3.VM：视图模型（ViewModel）：Vue实例（1）data中的所有属性，最后都出现在了Vue实例上（2）vm身上的所有属性以及Vue原型上的所有属性，在Vue模板中都可以直接使用...
2021-12-28 10:15:06
324
原创 Vue中数据绑定的方式
Vue中有两种数据绑定方式：1.单向数据绑定(v-bind):数据只能从data流回页面（单向传递）2.双向数据绑定(v-model)：数据不仅可以从data流向页面，还可以从页面流向data（1）双向数据绑定一般都应用在表单类元素上（如：input select checkbox等）（2）v-model:value 可以简写为 v-model 因为v-model默认收集的就是value值...
2021-12-28 09:43:57
737
原创 CSS属性大全总结
文字属性：字体：font文本字体：font-family文本字号：font-size文本字体样式：font-style文本字体粗细：font-weight文本字体行高：font-height内容水平对齐：text-align文本缩进：text-index文本大小写：text-transform文本不换行：white-space文本溢出裁切：text-overflow文本下划线：text-decoration文本阴影：text-shadow颜色：colo
2021-12-28 08:36:11
123
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人