1, 如何让 CSS 只在当前 组件中起作用(vue 中如何实现样式隔离)?
在组件中的 style 前面加上 scoped, 如果父子组件都有样式隔离, 则父组件中无法修改子组件
样式, 此时可用样式穿透修改 父组件选择器>>>子组件选择器{子组件样式}
2, <keep-alive></keep-alive>的作用是什么?
keep-alive 是 Vue 内置的一个组件,可以使被包含的组件保留状态,或避免重新渲染。
3, vue 组件中如何获取 dom 元素?
使用 ref 属性获取, 在组件模板元素中添加 ref 属性, 在 js 中用 this.$refs 获取
4, 说几个 vue 中的指令和它的用法?
v-model 双向数据绑定;
v-for 循环;
v-if, v-show 显示与隐藏;
v-bind 动态绑定属性
v-on 事件绑定;
v-once: 只绑定一次。
5, v-on 指令可以同时监听多个函数吗?
可以, v-on 的事件监听类似于 DOM 原生 api 添加事件监听者 addEventListener
6, vue 循环中为什么使用 key?
需要使用 key 来给循环中每个节点做一个唯一标识,要保证一个循环中 key 的值各不相同,
以避免 vue 中的重用机制造成可能的渲染异常. 从底层来看, key 属性主要为了 Diff 算法就
可以正确的识别此节点。并高效的更新虚拟 DOM。
7, vue 的组件配置对象中都有哪些常用字段?分别是什么作用?
Data 组件中的数据
props 组建的属性数据,接收父组件的传值
computed 计算属性
components 定义或引用子组件
methods 自定义函数
watch 属性监听
filters 数据过滤器
mounted 等生命周期函数
8,分别简述 computed 和 watch 的使用场景
computed:
当一个属性受多个属性影响的时候就需要用到 computed
例子: 购物车商品结算的时候
watch:
当一条数据影响多条数据的时候就需要用 watch
例子:搜索数据