小米前端面经整理（二）

Vue兄弟组件传值

1，首先创建一个事件总线，例如bus，作为一个通讯的桥梁；
2，在需要传值的组件中，通过e m i t 触 发 一 个 自 定 义 事 件 ， 并 传 递 参 数 ；
3 ，在接收数据的组件中，通过on监听自定义事件，并处理传递过来的参数；；

父组件向子组件传递数据是通过prop传递的，子组件传递数
据给父组件是通过$emit触发事件来做到的

VUE自定义指令

通过directives
自定义指令

VUEX的mutation和action的区别

• mutation处理同步任务，action处理异步任务
• Mutation：专注于修改State；Action：业务代码

找出数组出现次数最多的那个（有 1 和 ‘1’ 要区分）

var arr = [1,2,3,'1',2];

function findMost (arr) {
    if (!arr.length) return;
    if (arr.length === 1) return 1;
    let res = new Map();
    let maxName, maxNum = 0
    // 遍历数组
    arr.forEach((item) => {
    	//区分类型
      key = typeof(item) + "_" + item;
      res[key] ? res[key] += 1 : res[key] = 1
      if (res[key] > maxNum) {
        maxName = item
        maxNum = res[key]
      }
    })
    return '出现次数最多的元素为:' + maxName + ', 出现次数为:' + maxNum;
}
console.log(findMost(arr));

v-if和v-show

v-if：当隐藏结构时该结构会直接从整个dom树中移除；

v-show：当隐藏结构时是在该结构的style中加上display:none，结构依然保留。
实用场景：
当组件中某块内容只会显示或隐藏不会被再次改变显示状态，此时用v-if更加合适，例如请求后台接口通过后台数据控制某块内容是否显示或隐藏，且这个数据在当前页不会被修改；
当组件某块内容显示隐藏是可变化的，此时用v-show更加合理，例如页面中有一个toggle按钮,点击按钮来控制某块区域的显示隐藏

ElementUI怎么校验数据

1. 表单上加rules｛object｝
2. 在el-form-item单个添加

ElementUI组件大小不符合需要的大小怎么办

1. 新建全局样式表
2. 通过内联样式