面试题

1，谈谈你对单项数据的理解？

　　当父组件给子组件传递数据的时候，子组件只允许进行接收，不能够进行修改，因为数据是单项流动的。

　　如果子组件修改了父组件的信息后，可能会导致其他组件也会发生一些莫名的错误，导致你的错误无法捕获

2，为什么组件中的data是一个函数而不是一个对象？

　　因为每个组件执行的时候都会返回一个对象，如果data是一个对象的情况下，那么这个对象就可能会进行复用（对象是引用数据类型）

　　但是如果是一个函数的情况下，那么就是以每次返回一个新的对象，保证每个组件都有一份独立的对象（状态）

3，动态组件

　　解释：多个组件通过同一个挂载点进行切换展示，通过is属性动态来改变组件

　　通过一个内置组件<component></component>以及这个组件的属性is来进行切换的

　　keep-alive：用来去包裹动态切换的页面或者组件（内置组件）

　　作用：凡是keep-alive包裹的组件，不会被二次创建和销毁，而是进行一个缓存

　　keep-alive组件身上会有以下这几个常用的属性

include：

　　值：字符串 正则表达式

　　作用：指定哪些组件被缓存

exclude：

　　值：字符串 正则表达式

　　作用：指定哪些组件被缓存

max：数字

　　作用：最大可以缓存多少个组件

　　凡是使用了keep-alive包裹的组件都会多2个生命周期函数

deactivated：

　　当组件被切换隐藏的时候会进行缓存状态的生命周期

activated：

　　当组件被切换显示的时候会进行进入活跃状态的生命周期

4.如何使每一个组件都拥有自己独立的css作用域

　　在style标签上添加一个属性scoped

slot插槽

　　正常情况下组件当作标签使用的时候，组件标签

基本使用（匿名插槽）：

　　1，在组件内部书写一个template标签，添加一个指令，v-slot

　　2，将需要做嵌套的内部放在template标签内部

　　3，在组件内部通过<slot></slot>进行接收

具名插槽：

　　有名字的插槽

　　1，在组件标签内部书写一个template标签添加一个指令v-slot：插槽的名称

　　2，将需要做嵌套的内部放在template标签内部

　　3，在组件内部通过<slot name="插槽的名称"></slot>进行接收

作用域插槽

　　带参数的插槽

　　数据的子传父

　　1，在组件内部通过<slot name="插槽名称"：自定义属性=“需要传递的值”></slot>绑定一个自定义属性   值为需要传递的数据

　　2，在组件标签内部书写一个template标签  标签添加一个指令v-slot：插槽的名称=“需要接收的这个对象”

　　3，在template内部的标签上进行数据的渲染{{需要接收的这个对象.自定义属性}}

Vue动画

　　1，如果需要使用Vue的动画，那么需要变动的元素外层必须加一个内置组件<transition></transition>

　　2，需要进行动画的元素必须经历隐藏和显示 v-if  v-show

 动画的类名

　　name就是动画的名称 template会有一个属性name name的值就是动画的名称

　　进入的类名

　　<name>-enter

　　<name>-enter-active

　　<name>-enter-to

　　离开的类名

　　<name>-leave

　　<name>-leave-active

　　<name>-leave-to

　　当多个元素需要相同的动画的时候  需要将transition  换成transition-group另外需要给每一个元素添加一个不同的key值

animate.css

　　当你使用了第三方的css动画库的时候，可以直接将动画的，名称通过以下方式赋值给transition

<transition

enter-class=""

enter-active-class=""

enter-to-class=""

leave-class=""

leave-active-class=""

leave-to-class=""

>

<div class="box" v-if="show" ></div>

</transition>