setState数组内变量不会更新视图

[ninetowns]

问题描述

如果state中是数组变量，在修改数组中值后不会更新视图

import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'

export default class Test extends Component {
  config = {
    navigationBarTitleText: ''
  }
  constructor() {
    super(...arguments)
    this.state = {
      abc:[]
    }
  }

  componentWillMount () { 
    setTimeout(()=>{
      this.setState({abc:[{a:1}]})
    },1000)
  }

  click(){
    let {abc} = this.state
    abc[0].a=2
    this.setState({
      abc
    })
  }

  render () {
    const {abc} = this.state
   //在click后这里的abc已经打印出了2，但视图没变化
    console.log('abc ',abc)
    return (
      <View onClick={this.click.bind(this)}>
       {abc[0].a}
      </View>
    )
  }
}

期望行为

可以及时更新视图

系统信息

Taro v1.3.27

Taro CLI 1.3.27 environment info:
System:
OS: Windows 7
Binaries:
Node: 10.12.0 - C:\Program Files\nodejs\node.EXE
npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD

[taro-bot]

CC @Chen-jj

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~