前端开发小技巧

@一棵菜菜  August 28, 2018

vue 获取元素DOM(ref属性)

<div ref=“refreshBtn”></div>
this.$refs.refreshBtn.style.transform = 'rotateZ(360deg)'

判断对象是否为空

JSON.stringify(obj) === '{}'

路由传参Object类型

查看参考的文章

json文件:
"components":{
  "pages":{
    "home":{
        "meta":{
          "title":"首页",
          "keywords":"关键字",
          "desc":"描述"
        },
       "title":"登录失败",
       "button":"重新登录"
    }
  }
}

如果直接传参会有问题

页面A:
wx.navigateTo({
    url: '/page/people/index?params=' + components.pages.home
});
页面B 接收到参数:(小程序)
console.log(options.params) //控制台输出:[object Object]

处理办法

页面A 传参前先对数据进行处理

var params = encodeURI(JSON.stringify(components.pages.home));
var url = `http://caiyichen.me?params=`+ params;

页面B 接收到参数后再解析

onLoad: function (options) {
    let home = JSON.parse(decodeURI(options.params))
}

后来发现可以不需要decode和encode(简写如下)

let home = JSON.parse(JSON.stringify(components.pages.home))

将数组拆分成几个小数组(二维数组)

    /**
     * 封装将数组拆分成几个小数组
     * @param {*} arr 数组
     * @param {*} len 每个小数组的长度
     */
    const splitArray = (arr, len) => {
      const arrLength = arr.length;
      const newArr = [];
      for (let i = 0; i < arrLength; i += len) {
        newArr.push(arr.slice(i, i + len));
      }
      return newArr;
    };

let data = ['赵','钱','孙','李','周','吴'];
let result = splitArray(data, 3);// [["赵", "钱", "孙"],["李", "周", "吴"]]

添加新评论