面试题
- vue
- css
- js
- JQuery
- 微信小程序面试题
vue
vue的特点是什么?
1.国人开发的一个轻量级框架。
2.双向数据绑定,在数据操作方面更为简单。
3.视图,数据,结构分离,不需要进行逻辑代码的修改,只需要操作数据就能完成相关操作。
4.组件化,方便封装和复用
5.虚拟DOM: dom操作是非常耗费性能的,不再使用原生的dom操作节点, 极大解放dom操作
vue中父子组件是如何传值的?
组件传值–父组件向子组件传值
第一步:父组件 在引用子组件时,通过属性绑定(v-bind:)的形式,把需要传递给子组件的数据,传递到子组件内部,供子组件使用
第二步:把父组件传递过来的数据, 在 props数组 中定义一下
组件中的 所有props 中的数据,都是通过父组件传递给子组件的
props 中的数据都是只读的,无法重新赋值
第三步:在该子组件中使用props数组 中定义好的数据
子组件通过事件调用向父组件传值
在子组件中,利用 $emit 触发 父组件传递过来的方法的时候,可以将子组件的数据当做参数传递给父组件
v-show和v-if指令的共同点和不同点?
共同点:都能控制元素的显示和隐藏。
不同点:实现本质方法不同。
v-show本质就是通过控制css中的display设置为none,控制隐藏,只会编译一次;
v-if是动态的向DOM树内添加或者删除DOM元素,若初始值为false, 就不会编译了。而且v-if不停的销毁和创建比较消耗性能。
说出几种vue当中的指令和它的用法?
1.v-model双向数据绑定
<input type="text" v-model="msg"/>
2.v-for循环
<div id="box">
<ul>
<li v-for="item in arr">
<span>{item.name}</span>
<span>{item.age}</span>
</li>
</ul>
</div>
<script src="text/JavaScript">
new Vue({
el:"#box",
data(){
return(){
arr:[
{
"name":"yifengchun","age":18},
{
"name":"yifengchun","age":18},
{
"name":"yifengchun","age":18},
{
"name":"yifengchun","age":18}
]
}
}
})
</script>
3.v-show 显示与隐藏
<div id="box">
<div style="width:100px;height:100px;border:1px solid red;display:none" v-show="show"