前端面试-element ui类

　　1.ElementUI是怎么做表单验证的？在循环里对每个input验证怎么做呢？

　　model 绑定表单数据,通过prop取表单数值,通过编写ref进行后台API验证 ,根据rules进行表单内容验证

　　2.你有二次封装过ElementUI组件吗？

　　popover + button 的组件，点击该按钮后还有个二次确认或选择的交互。 InfiniteScroll 封装个简单的带触底加载的列表 　

<template>
  <el-input
    placeholder="价格"
    v-model="current"
    :disabled="disabled"
    :maxlength="8"
    @change="change"
  ></el-input>
</template>
<script>
export default {
  props: {
    value: Number,
    disabled: Boolean
  },
  data() {
    return {
      current: ""
    };
  },
  watch: {
    value(val) {
      if (val > 0) {
        this.current = (val / 100).toFixed(2);
      } else {
        this.current = "";
      }
    }
  },
  created() {
    if (this.value > 0) {
      this.current = (this.value / 100).toFixed(2);
    } else {
      this.current = "";
    }
  },
  methods: {
    change() {
      let value = this.current * 100 || 0;
      this.current = (value / 100).toFixed(2);
      this.$emit("input", value.toFixed(0) * 1);
    }
  }
};
</script>

 

　　3.ElementUI怎么修改组件的默认样式？

　　方法一：/deep/ 方法二：>>> 方法三：在外层添加一层div，设置自定义类名，再修改里边的样式, 格式.自定义类名 .需要修改的样式 {}。

　　4.ElementUI的穿梭组件如果数据量大会变卡怎么解决不卡的问题呢？ 在 left-footer 的 slot 里面加个翻页组件， 并修改 filter-method 方法重绘穿梭机组件， 大概保持每页 50 条这样子。

　　5.ElementUI表格组件如何实现动态表头？　

<template v-for="item in tableColownms"> <el-table-column v-if="item.type!='hidden'" :key="item.id" :prop="item.field" sortable :label="item.label"> </template>

　　　

　　6.ElementUI使用表格组件时有遇到过问题吗？

　　@isbase Object.freeze 这算是一个性能优化的小技巧吧。在我们遇到一些 big data的业务场景，它就很有用了。尤其是做管理后台的时候，经常会有一些超大数据量的 table，或者一个含有 n 多数据的图表，这种数据量很大的东西使用起来最明显的感受就是卡。但其实很多时候其实这些数据其实并不需要响应式变化，这时候你就可以使用 Object.freeze 方法了，它可以冻结一个对象(注意它不并是 vue 特有的 api)。 当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性，并使用 Object.defineProperty 把这些属性全部转为 getter/setter，它们让 Vue 能进行追踪依赖，在属性被访问和修改时通知变化。 使用了 Object.freeze 之后，不仅可以减少 observer 的开销，还能减少不少内存开销。相关 issue。 使用方式：this.item = Object.freeze(Object.assign({}, this.item))

　　7.有阅读过ElementUI的源码吗？

　　读过, 公司封装自己的UI库的时候, 我都过很多UI库的源码, 比如element, iview, vuetifyjs, 等

　　8.项目中有使用过ElementUI吗？有遇到过哪些问题？它的使用场景主要是哪些？

　　当然是用过了 很多后台系统，都会是用vue结合上ElementUI来实现，很大程度上提高了开发效率； 遇到的问题：对于修改其默认样式需谨慎。

　　9.有用过哪些vue的ui？说说它们的优缺点？

　　个人认为iview比elementUI好看，elementUI在多级联动菜单有一个bug（父子value一样的时候不显示）