React/Taro多端开发小程序实用属性、技巧等

1. 在text上添加之后，可以使用&nbsp；空格符号

decode="{{true}}"

2. 获取一个对象{1: 0, 2: 0}里的第n个数据

console.log(res[Object.keys(res)[0]])

3. 修改react，state里一个对象的某个属性

   let menuList = this.state.menuList
     menuList[i].isActive = !menuList[i].isActive
     this.setState({
       menuList
     })

4. 解决父传子组件数据更新时子组件不刷新，一般需判断传递过来的数据的是否发生变化

   if(nextProps.has_notice != this,state.has_notice) {
     	componentWillReceiveProps(nextProps) {
      		this.setState({
       		has_notice: nextProps.has_notice
       	})
     	}
   }

5. 携参传值方法

两个默认和一个按需携带

@select="(section, row) => someRightCheck(section, row, index)"

一个默认和按需携带

@select-all="allRightCheck($event, index)"

6. 单/多数组去重

将A数组里跟B数组相同的数据去除

A = [ {id: 1}, {id: 2}, {id: 3}, {id: 4} ]
B = [ {id: 1}, {id: 2} ]
const BNew = B.reduce((acc, v) => {
          acc[v.id] = true
          return acc
        }, {})
console.log(BNew)
// BNew = {1: true, 2: true}
const ANew = A.filter(v => !BNew[v.id])
// ANew = [ {id: 3}, {id: 4} ]

将A数组push到B数组并去重

    A = [ 1, 2, 3, 4, 5, 4, 3, 2, 7, 7]
    ANew = []
    A.forEach((element, index, A) => {
      ANew.push(element)
    })
    ANew = Array.from((new Set(ANew)))
    console.log(ANew)
// ANew = [ 1, 2, 3, 4, 5, 6, 7 ]

7. trim()的使用

trim() 方法用于删除字符串的头尾空白符，空白符包括：空格、制表符 tab、换行符等其他空白符等。
trim() 方法不会改变原始字符串。
trim() 方法不适用于 null, undefined, Number 类型。

8. 使用js，根据属性值判断对象数组中是否有某个对象，有则替换，无则添加

export const formateArrObjData = (initialArr, obj, pro) => {
  // 判定数据是否为数组
  if (!(initialArr instanceof Array)) {
    return '请传入正确格式的数组'
  }
  // 判定数据是否为对象
  if (!(obj instanceof Object)) {
    return '请传入正确格式的对象'
  }
  if (!pro) {
    return '请传入正确格式的属性名'
  }
 
  let index = initialArr.findIndex((val) => val[pro] === obj[pro])
  // 如果有就替换  没有就添加
  if (initialArr.findIndex((val) => val[pro] === obj[pro]) !== -1) {
    tempArr.splice(index, 1, obj);
  } else {
    tempArr.push(obj);
  }
  return tempArr
}
 
使用：this.tableArr = formateArrObjData(this.tableArr, tempObj, tempId)

9. 微信小程序配置默认启动页面