elementUI笔记(view:367)

1.checkbox-group绑定的值是按照点击的顺序保存的,所以如果对索引位置敏感,就需要手动排序

2.表单清空验证信息
this.$refs['form'].clearValidate(['mobile'])
this.$refs['form'].clearValidate()
如果form是通过v-if控制显示的,则对应代码要放到$nextTick中
this.$nextTick(() => {
this.$refs.form.clearValidate()
})

3.el-dropdown中的click不生效,使用@click.native

<el-dropdown size="mini" split-button type="primary">
  <span>更多操作</span>
  <el-dropdown-menu slot="dropdown">
    <el-dropdown-item @click.native="handleServiceList(scope.row)">
      <span size="mini" type="primary">服务列表</span>
    </el-dropdown-item>
  </el-dropdown-menu>
</el-dropdown>

4.v-for中的input无法输入
加个@input在方法里写this.$forceUpdate()

5.el-table数据切换后无法正确显示

<el-table-column prop="reservationID" label="" width="0px">
</el-table-column>

用空的label和width添加一个不显示的列

6.el-input的@input事件传递多个参数
el-inpu位于el-table中,类型为number,设置了min,但是手动输入的时候并min不会生效,此时如果输入值小于预设值则提示并重置输入值为最小值

<el-input type="number" v-model="scope.row.customPrice" :min="scope.row.price" :step="10" size="mini" @input="(val)=>{customPriceInput(val,scope.row.price,scope.row)}" clearable></el-input>

customPriceInput(v,price,row){
  if (Number(v)<price){
    this.$message.error('自定义价格不能低于当前价格')
    row.customPrice = price
  }
},