Taro: 小程序setState改变数组中的某一项或者某一属性没有生效

[jyjey]

问题描述
由于微信小程序的限制一次setState不能超过1024kb，按微信官方文档逐个set数组中的元素，无效。
原生微信小程序代码可以实现。

[或者可以直接贴源代码，能贴文字就不要截图]

setOrderData = (orderData, index) => {
    if(orderData.length > index){
      let key = "orderData["+index+"]";
      this.setState({
        [key]: orderData[index]
      }, () => {
        this.setOrderData(orderData, index + 1)
      })
    }
  };

期望行为
能正常改变数组中的某一项或者某一属性

报错信息

无报错信息，state中没有数据变化

系统信息

Taro CLI 1.2.14 environment info:
System:
OS: Windows 10
Binaries:
Node: 10.15.1 - D:\workTool\nodejs\node.EXE
Yarn: 1.13.0 - C:\UsersACEAppData\Roaming\npm\yarn.CMD
npm: 6.4.1 - D:\workTool\nodejs\npm.CMD

[taro-bot[bot]]

欢迎提交 Issue~

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

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

Good luck and happy coding~

[Chen-jj]

@jyjey 提供一下可复现代码

[jyjey]

import Taro, { Component, Config } from '@tarojs/taro'
import {View, Text, Image} from '@tarojs/components'
import {AtNavBar, AtTabs, AtTabsPane, AtList, AtListItem, AtButton, AtIcon} from 'taro-ui'

export default class Order extends Component {

  /**
   * 指定config的类型声明为: Taro.Config
   *
   * 由于 typescript 对于 object 类型推导只能推出 Key 的基本类型
   * 对于像 navigationBarTextStyle: 'black' 这样的推导出的类型是 string
   * 提示和声明 navigationBarTextStyle: 'black' | 'white' 类型冲突, 需要显示声明类型
   */
  config: Config = {
    navigationBarTitleText: '订单'
  };
  openid = '';
  constructor () {
    super(...arguments)
  }


  state = {
    orderData:[]
  };



  setOrderData = (orderData, index) => {
    if(orderData.length > index){
      let key = "orderData["+index+"]";
      this.setState({
        [key]: orderData[index]
      }, () => {
        this.setOrderData(orderData, index + 1)
      })
    }
  };




  componentWillMount ()
  {
    let orderData = ["Strawberry", "Banana", "Mango"];
    this.setOrderData(orderData, 0);
  }

  componentDidMount () { }

  componentWillUnmount () { }

  componentDidShow () { }

  componentDidHide () { }



  render () {
    const {orderData} = this.state;
    console.log(orderData); //这里并没有更新到orderData
    return (
      <View>

      </View>
    )
  }
}

[jyjey]

@Chen-jj

[Chen-jj]

@jyjey Taro 在小程序 setData 前，会做一次 diff ，你正常 setState 即可

[Chen-jj]

882

[taro-bot[bot]]

Hello~

您的问题楼上已经有了确切的回答，如果没有更多的问题这个 issue 将在 15 天后被自动关闭。

如果您在这 15 天中更新更多信息自动关闭的流程会自动取消，如有其他问题也可以发起新的 Issue。

Good luck and happy coding~

[jyjey]

@jyjey Taro 在小程序 setData 前，会做一次 diff ，你正常 setState 即可

感谢