项目随笔-记录项目中遇见的问题

一、vue中$event理解和框架中在包含默认值外传参
项目在table表中使用到了,因为table在多选状态下,没有直接绑定选中值,所以使用这个。

<el-table
            ref="multipleTable"
            :data="tableData"
            height="a"
            @selection-change="multipleSelection = $event"
            border
          >
   el-table>

这里的event指的就是默认参数
Vue中自定义事件的$event
项目随笔-记录项目中遇见的问题_第1张图片

<el-button
                            size="mini"
                            type="text"
                            style="margin-left:2vw;font-size:14px"
                            @click="handleEdit($event)"
                        >编辑el-button>

这里的event指的是点击事件
项目随笔-记录项目中遇见的问题_第2张图片
在vue中,如果事件有默认参数,则$event说的是默认参数,否则就是指原生事件
如果想传递除去默认参数之外的变量,可以用这个方法

二、vue中 this.$set的用法详解
vue中 this.$set的用法详解
(1)vue的数组和普通的数组不一样

三、如何去除去除treeSelect-“(unknow)”

// 去除treeSelect-“(unknow)”
    splitUnknow(){
      this.$nextTick(()=>{
        document.querySelectorAll(".vue-treeselect__single-value").forEach(item=>{
          item.innerHTML&&(item.innerHTML=item.innerHTML.split("(unknown)")[0]);
        })
      })
    },

四、document.querySelectorAll(".vue-treeselect__single-value") 用法
document.querySelector()方法
VUE遇到的坑----queryselector选择器的问题
五、在函数中使用回调函数[避免多次使用函数]

//使用函数
this.findStandTree(item,this.tableData[index].partYear,(data)=>{this.$set(this.tableIndustryList,index,data)})
//定义函数
    findStandTree(item,year,callback){
      item&&year&&this.$api.findStandTree({
        "scope": item,
        "partYear": year
      }).then(res=>{
        if(res.code==200){
          callback(this.getTrees(res.data))
        }else{
          callback([])
          this.$message.warning(res.description);
        }
      })
    },

六、巧用typeOf

七、对比一下自己给表单复制的方法,下面的方式更优化一些,可以尝试使用

 this.dataInfo={
            id:null,
            dateType:1,
            partYear:null,
            period:null,
            file:null
          }

七、注意
每次项目启动前把代理放开,启动完就注释,直到项目下次启动前都不需要动了,包括提交推送打包都不需要动
八、@keydown.enter.prevent
v-text

 <p :contenteditable="formFlag" @keydown.enter.prevent="next(3)" @blur="next(3)" v-text="scope.row.calculationResults" @input="scope.row.calculationResult=$event.target.innerHTML"></p>

九、el-table可以自定义表头名称

原来table的某一行,可以绑定某一行的值,或者某一列的循环值。
十、地铁上需要学习的东西
@keyup.native
vue中的事件处理
项目随笔-记录项目中遇见的问题_第3张图片
在这里插入图片描述
因为输入框里的是字符串,所以可以直接这样写。如果想提取输入框中的一部分,可以用这个方法
2.

  if(this.scoreList[idx].data[index].grade && !/^[0-9]*$/.test(this.scoreList[idx].data[index].grade[0])){
        this.scoreList[idx].data[index].grade.substr(1).length>0?(this.$set(this.scoreList[idx].data[index],"grade",this.scoreList[idx].data[index].grade.substr(1))):(this.$set(this.scoreList[idx].data[index],"grade",null));
        return false;
      }

正则表达式判断

你可能感兴趣的