vue中几种常见技巧

1、校验延迟：点击进入页面不希望校验必填字段
this.$nextTick(() => { this.$refs.formRules.clearValidate() })
2、$on  $emit   $off

RightEmit.$on("click-btn", this.clickBtn); //监听事件

RightEmit.$emit('risk-info-mounted') //提交事件

RightEmit.$off("click-btn", this.clickBtn); // 清除事件监听
3、必填字段校验

this.$refs.myForm.validate(valid => {
　　if(valid){}

})
4、重置并重新查询

　this.$refs[mylist].resetFields(); 

  this.search();//减少无用的交互
5、清空选中项，多用于多选列表

this.$refs.mylist.clearSelection();
6、带提示的确认

this.$confirm(str, '提示', {
  dangerouslyUseHTMLString: true
}).then(() => {
　　//点击确认之后的操作
}).catch(() => {});
7、js后台请求模板

let param = {
  a: "a",
}

api.show(param).then(resp => {
  if (resp.code === 1) {
    if (resp.data != null) {
     //成功操作
    }
  }
}).catch(() => {
});
8、删除带提示

this.$confirm('确定要删除吗?', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  type: 'warning'
}).then(() => {
  this.survey.curveyLogList.splice(i, 1);//删除元素
})
9、数组添加元素、删除元素

this.arr.push({});  //添加

this.arr.splice(i, 1);  //删除

10、this.$forceUpdate();  //刷新

转载于:https://www.cnblogs.com/sunny-miss/p/10762899.html