Vue学习

1.Vue屏蔽eslint

package.json

"rules": {
      "generator-star-spacing": "off",
      "no-debugger": "off",
      "no-tabs": "off",
      "no-unused-vars": "off",
      "no-console": "off",
      "no-irregular-whitespace": "off"
    }

2.reduce

3.js删除最后一位元素

//slice
function truncate(arr) {
    return arr.slice(0,-1);
}
//利用filter
function truncate(arr) {
    return arr.filter(function(v,i,ar) {
        return i!==ar.length-1;
    });
}
//利用push.apply+pop
function truncate(arr) {
    var newArr=[];
    [].push.apply(newArr, arr);
    newArr.pop();
    return newArr;
}
//利用concat+pop
function truncate(arr) {
    var newArr = arr.concat();
    newArr.pop();
    return newArr;
}
//普通的迭代拷贝
function truncate(arr, item) {
    var newArr=[];
    for(var i=0;i<arr.length-1;i++){
        newArr.push(arr[i]);
    }
    return newArr;
}
 

4.vue.config.js

module.exports = {
    productionSourceMap:false,
    // 关闭ESLINT校验工具
    lintOnSave: false,
    //配置代理跨域
    devServer: {
      proxy: {
        "/api": {
          target: "服务器IP",
        },
      },
    },
  };
  

5.函数的防抖与节流

防抖:前面所有触发都被取消,最后一次执行在规定时间之后才会触发(连续快速触发,只执行最后一次)

节流:在规定的间隔时间内不会重复触发回调,只有大于时间间隔时才会触发

lodash插件


防抖

  button.onclick = _.debounce(function(){
      //请求
  })

节流
button.onclick = _.throttle(function(){

},1000)

6.箭头函数默认有return方法

两种写法

 let result = row.spuSaleAttrValueList.every(
     (item) => item.saleAttrValueName != inputValue
        );

let result = row.spuSaleAttrValueList.every(item => {
     return item.saleAttrValueName != inputValue
        })

第二种{ }需要加入return返回结果

7.清除数据

Object.assign(this._data,this.$options.data())

Object.assign()将后面的数据合并到前面中,this._data是目前所有的响应式对象数据,$option为当前组件的配置对象,$option.data()为初始化的data数据(空)