element暂无内容 elementui常见问题

评价一个ui框架的优劣，当然易用性啦~~
1.最常见的问题：form表单的每一项的prop属性是为了提供表单验证，尽量填写，而且名字需要和每个表单项绑定的值的名字一致，否则表单验证validate方法和重置表单resetFields方法不起作用。
2.el-menu-item菜单组件的index属性是可以起router作用的，必须是字符串。el-submenu的Index的值如果相同，则同时展开关闭一级菜单项。
3.为防止默认激活（default-active）的菜单项在点击页面刷新后丢失，每次点击需要将激活菜单项存入sessionStroage中。每次created的时候，将其取出，存在本地渲染。
4.表单渲染过程中要经常用到作用域插槽(在最新的vue版本中已失效，通过v-slot替代)，渲染数据。

<el-table-column label="状态">
  <template slot-scope="scope">
    <el-tag v-if="scope.row.state=='0'">未提交</el-tag>
    <el-tag type="success" v-else>已通过</el-tag>
  </template>
</el-table-column>

5.在使用MessageBox消息确认组件的时候，需要用async await解析其返回的Promise对象。当用户选择取消的时候会报错，需要catch一下异常。

const confirmResult = await this.$confirm(
        '是否确认删除计划?',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      ).catch(err => err)

6.在使用tag组件的动态编辑标签时，按照要求，按照例子，使用this.$nextTick。页面再次渲染后，再让input框获得焦点,不然还没渲染出来就获取焦点容易报错。

showInput() {
        this.inputVisible = true;
        this.$nextTick(_ => {
          this.$refs.saveTagInput.$refs.input.focus();
        });
      },

7.使用el-upload上传文件的时候，可以通过:data属性加上id作为额外参数直接上传成功。也可以调用on-success上传成功后返回的路径(如果后端返回)加上其他表单项一起提交。可以设置手动上传。如果使用了token，需要在组件的header属性设置对应的Authorization字段。
8.npm包的版本、版本、版本。项目中引入对应的组件不生效(尤其是样式类的)，那么第一时间查找的问题一定是版本是否对应。
ps前端渲染技巧：三元选择、多层循环、递归（函数内部调用自己），及本地玩转各种数组、字符串，该重新获取列表就获取，该改变局部数据就改变局部，武功招式、在于灵活运用。