Question

this.state = {
            color: {
              B: '#FFB1C2', // RED
              C: '#A7EBEB', // GREEN
              D: '#99BFFF', // BLUE
              E: '#F9C499', // ORANGE
              F: '#B2A9A7', // BROWN
              DEFAULT: '#B7C7CE' // DEFAULT
            }
}

changeChartColor = (color) => {
   this.setState({ B: color.hex })
};

我正在使用反应库来更改屏幕的颜色，该功能处的(color)会以我选择的数据color进行响应。如何通过this.state.color.B功能访问changeChartColor？

Answer 1

就像其他常规js对象一样

SELECT COUNT(*)
FROM Orders
WHERE DATEDIFF(day,RequiredDate,ShippedDate)=10;

如果在设置后需要访问它，请使用回调函数，因为this.state.color.B不同步

setState

如果需要设置this.setState({ B: color.hex }, () => this.state.color.B)，请使用扩展语法更新color.B对象

color

this.setState({ color: { ...this.state.color, ...{ B: color.hex } } })是一个复杂的对象，可以链接扩展语法。您不仅限于更新单个字段。

如果您拥有全新的状态并且所有颜色都已更新，那么这样做就更容易

this.setState({
   color: {
       ...this.state.color,
       ...{
           B: {
               ...this.state.color.B,
               ...{
                   r: 'R',
                   // update all or some of `B` fields.
               }
           },
           C: {
               ...this.state.color.C,
               ...{
                   g: 'G',
               }
           }
       }
   }
})

如何从功能访问状态

1 个答案: