vue
菠萝菠萝�
这个作者很懒,什么都没留下…
展开
-
nextTick的原理和用途
前言:我们都知道,vue是一个异步渲染,也就是说,data改变之后,DOM不会立刻渲染原理:异步渲染,$nextTick 待 DOM 渲染完再回调(nextTick函数将回调延迟到下次 DOM 更新循环之后执行)而且页面渲染时会将data的修改做整合,多次data修改只会渲染一次用途:需要在视图更新之后,基于新的视图进行操作。更多常见vue面试题可戳此处...原创 2021-02-22 11:51:00 · 207 阅读 · 0 评论 -
实现自定义v-model
在单个组件中:<input type="text" :value="age" @input="age=$event.target.value">以上代码分两个步骤:将输入框的值绑定到age变量上,这个是单向绑定,意味着改变age变量的值可以改变input的value,但是改变value不能改变age监听input事件(input输入框都有该事件,当输入内容时自动触发该事件),当输入框输入内容就单向改变price的值,这样就实现了双向绑定。在组件上使用v-model:新建一个组件原创 2021-02-22 11:44:24 · 228 阅读 · 0 评论 -
created和mounted有什么区别?
created:页面还没有开始渲染,但是vue实例已经初始化完了mounted:页面已经渲染完了,可以获取到DOM更多常见vue面试题可戳此处原创 2021-02-22 11:09:57 · 149 阅读 · 0 评论 -
vue中组件之间的通讯方法
1、父传子父组件给子组件传值,利用属性的形式传值给子组件,子组件用props来接收父组件:<List :todoList="todoList"></List>子组件:props:{ todoList:{ type:Array, default:[] }},2、子传父子组件通过$emit给父组件触发一个事件,父组件接收这个事件来绑定相应的事件,在该事件中操作子组件:<ul> <li v-for="原创 2021-02-22 10:38:21 · 119 阅读 · 0 评论 -
vue事件绑定函数加括号和不加括号的区别
当不加括号的时候,event可以直接拿到,当需要传参的时候,要想用event参数,必须手动添加$event才可以使用<div> <p>event-demo</p> <p>{{num}}</p> <button @click="add1">+1</button> <button @click="add2(3,$event)">+2</button></div&g原创 2021-02-04 11:41:32 · 200 阅读 · 0 评论 -
vue常见面试题
1、v-if 与 v-show的区别:两者都是条件渲染,但是v-if是真正意义上的,当v-if为false时,DOM元素都没有创建,但是v-show创建了,只是display的值为none;所以很明显,二者的使用场景也是有区别的:v-if适合不频繁的切换场景,v-show则适合频繁切换的场景...原创 2021-02-04 10:33:22 · 129 阅读 · 0 评论 -
computed与watch的区别:
首先,computed和watch都是观察页面的数据变化的。计算属性computed:是有缓存的,只有所依赖的数据发生变化才会重新计算,否则会取缓存中的数据;不支持异步,在里面操作异步无效监控的自定义变量不可以与data里面的重名,否则会失效有get和set方法侦听属性watch:监听引用类型拿不到oldVal,值类型可以监听data里面的数据需要深度监听的时候,要使用handler + deep:true;不支持缓存支持异步监听的时候拿到两个值(newVal,oldVal)原创 2021-02-04 10:31:44 · 177 阅读 · 0 评论 -
v-if 与 v-show的区别:
两者都是条件渲染,但是v-if是真正意义上的,当v-if为false时,DOM元素都没有创建,但是v-show创建了,只是display的值为none;所以很明显,二者的使用场景也是有区别的:v-if适合不频繁的切换场景,v-show则适合频繁切换的场景...原创 2021-02-03 17:56:43 · 75 阅读 · 0 评论