- 博客(24)
- 收藏
- 关注
RSS订阅原创 列表无限滚动
span>我是第{{ item }}条数据watch: { //滚动监听 如果滚动高度大于item高度触发。// 51是list-item的高度。
2023-08-24 14:18:20
69
原创 Vuex的五个属性
state，getters，mutations，actions，modules.1.state: vuex的基本数据，放置状态相关信息，用来存储变量，只能有一个state。2.getter: 从基本数据(state)派生的数据，相当于vue里的计算属性；getter的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算。3.mutation: 提交更新数据的方法，相当于vue里面的methods，也是定义...
2021-12-02 17:45:20
788
原创 Ajax原理
Ajax的原理简单来说是在用户和服务器之间加了—个中间层(AJAX引擎)，通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。使用户操作与服务器响应异步化。这其中最关键的一步就是从服务器获得请求数据 Ajax的过程只涉及JavaScript、XMLHttpRequest和DOM。XMLHttpRequest是ajax的核心机制 /** 1. 创建连接 **/ var xhr = null; ..
2021-10-19 19:15:01
92
原创 关于VueComponent
1. school组件本质是一个名为VueComponent的构造函数，且不是程序员定义的，是Vue.extend生成的。2.我们只需写<school/>，Vue解析时会帮我慢创建school组件的实例对象，即Vue帮我们执行的：new VueComponent(options)。3.特别注意：每次调用Vue.extend,返回的都是一个全新的VueComponent。4.关于this指向： (1).组件配置中： data函数、me...
2021-10-15 09:23:26
187
原创 vue的生命周期
将要创建 ==>beforeCreate创建完毕 ==>created将要挂载 ==>beforeMount挂在完毕 ==>mounted --------【重要钩子】将要更新 ==>beforeUpdate更新完毕 ==>updated将要销毁 ==>beforeDestroy--------【重要钩子】销毁完毕 ==>destroyed...
2021-10-14 18:34:40
156
原创 vue数据监测的原理
1.vue会监视data中所有层次的数据。2.如何监测对象数据中的数据? 通过stter实现监测，且要在nuw Vue时就传入要监测的数据。 （1）对象中后追加的属性，Vue默认不做响应式处理 （2）如需给后添加的属性做响应式，使用如下API: Vue.set(target, propertyName/index, value)或...
2021-10-11 20:15:18
221
原创 key的内部原理
1.虚拟DOM中key的作用： key是向虚拟DOM对象的标识，当数据发生变化时，Vue会根据【新数据】生成【新的虚拟DOM】， 随后Vue进行【新虚拟DOM】和【旧虚拟DOM】的差异比较，比较规则如下：2.对比规则： （1）旧的虚拟DOM中找到与新虚拟DOM相同的key: ①若是虚拟DOM中内容没变，则直接使用之前真实DOM ②若是虚拟DOM中内容变了，则生成新的真实DOM，随后替...
2021-10-11 10:36:10
282
原创 计算属性computed
1.定义：要用的属性不存在，要通过已有的属性计算得来。2.原理：底层借助了Object.defineproperty方法提供的getter和setter。3.get函数什么时候执行？ (1).初次读取时会执行一次。 (2).当依赖的数据发生改变时会被再次调用。4.优势：与methods实现相比，内部有缓存机制，效率更高，调试方便。5.备注： （1）计算属性最终会出现在vm上，直接读取使用即可。 （2）如果计算属性要被修改...
2021-10-08 18:40:30
99
原创 MVVM设计模式
View是视图，就是DOM；对应视图也就是HTML部分--代表UI组件，它负责将数据模型转化成UI展现出来。 Model是模型，就是vue组件里的data，或者说是vuex里的数据；--代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。 ViewModel--监听模型数据也就是data的的改变和控制视图行为、处理用户交互，简单理解就是一个同步View和Model的对象，连接Model和View。在MVVM架构下，View和Model之间并...
2021-10-08 14:50:53
178
原创 关于回流和重绘
在讨论回流与重绘之前，我们要知道：浏览器使用流式布局模型 (Flow Based Layout)。浏览器会把HTML解析成DOM，把CSS解析成CSSOM，DOM和CSSOM合并就产生了Render Tree。有了RenderTree，我们就知道了所有节点的样式，然后计算他们在页面上的大小和位置，最后把节点绘制到页面上。由于浏览器使用流式布局，对Render Tree的计算通常只需要遍历一次就可以完成，但table及其内部元素除外，他们可能需要多次计算，通常要花3倍于同等元素的时间，这也是为什么要
2021-10-08 09:02:18
125
原创 JS的深浅拷贝
浅拷贝是创建一个新对象，这个对象有着原始对象的属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值，如果属性是引用类型，拷贝的就是内存地址，所以如果其中一个对象改变了这个地址，就会影响到另一个对象。深拷贝是讲一个对象从内存中完整的拷贝一份出来，从堆内存中开辟一个新的区域存放新对象，且修改新对象不会影响原对象浅拷贝 赋值的区别当我们吧一个对象赋值给一个新的变量时，赋的其实是该对象在栈中的地址，而不是堆中的数据。也就是两个对象指向的事同一个存储空间，无论哪个对象发生改变，其实都是改.
2021-09-28 10:42:14
101
原创 ES6中可迭代对象有哪些
1. 在ES6中，数组、Set、Map、字符串都是可迭代对象。2. 默认情况下定义的对象（Object）是不可迭代的，但是可以通过Symbol.Iterator创建迭代器。
2021-09-27 19:33:08
417
原创 ES6中let和const的区别
相同点：1，不存在提前声明2，声明只在块级作用域有效3，存在暂时性死区4，不可重复声明不同点:1，let声明的是变量，可以改变，值和类型都可以改变；const声明的是可读的常量，一旦声明不可改变。2，const总是指向一个固定的地址const foo = {};// 为 foo 添加一个属性，可以成功foo.prop = 123;foo.prop // 123// 将 foo 指向另一个对象，就会报错foo = {}; // TypeError: "foo"
2021-09-26 10:58:51
342
原创 JS中关于继承的理解
使一个构造函数对象能使用原型链继承另一个构造函数对象原型上的属性和方法，而通过经典继承函数继承实例属性理解继承的主要核心代码：Dog.prototype = new Animal();Dog.prototype被赋值为Animal的实例,使得Dog可以获取到Animal的方法,可以说这一段代码是连接两个构造函数的桥梁...
2021-09-24 09:54:30
171
原创 设置图片hover放大
1.给图片设置一个父元素，与之同宽高。2.给父元素设置overflow,做隐藏溢出处理 .div1{ width: 230px; overflow: hidden; }3.给图片增加transition,设置tranform:scaleimg { width: 230px; cursor: pointer; transiti
2021-09-24 09:40:37
2331
原创 JS正则表达式练习
匹配密码，必须包含大写，小写和数字,和特殊字符(!,@,#,%,&),且大于6位varreg1=/^(?=.*[A-Z])(?=.*[a-z])(?=.*[\d])(?=.*[!@#$])[A-Za-z\d!@#%&]{6,}$/g;varstr1="Wl#1223!";varresult=reg1.exec(str1);console.log(result);...
2021-08-31 16:44:28
91
原创 2021-08-31关于数组去重
vararr=[1,2,2,2,4,2,5,3,4,3];for(vari=0;i<arr.length;i++){for(varj=i+1;j<arr.length;j++){while(arr[i]==arr[j]){arr.splice(j,1);}}}console.log(arr)
2021-08-31 16:41:27
59
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人