反应本机-状态更改，但组件未重新渲染

Question

我正在制作一个菜单来更改Google Maps API的类型，但是按下的状态无法按我预期的方式工作。需要注意的是文本组件内部的状态没有被重新渲染后this.state.pressed通过功能改变setPressedState，它不包含在组件上重新绘制MapMenu使用后组件getPressed。

注意：警报显示按下的状态正在更改。

class MapMenu extends Component{
    constructor(props){
        super(props);

        this.state = {
            pressed: 'standard'
        }
    }

    setPressedState(press){
        this.state.pressed = press;
        Alert.alert(this.state.pressed)
    }

    getPressed(){
        return(this.state.pressed);
    }

    render(){
        return(
            <View style={styles.container}>
            <View style={{backgroundColor: 'red'}}><Text>{this.state.pressed}</Text></View>

                <TouchableOpacity   style={styles.button}
                                    onPress={() => this.setPressedState('standart')}
                >
                    <Text>Mapa</Text>
                </TouchableOpacity>
                <TouchableOpacity   style={styles.button}
                                    onPress={() => this.setPressedState('hybrid')}
                >
                    <Text>Hibrido</Text>
                </TouchableOpacity>
                <TouchableOpacity   style={styles.button}
                                    onPress={() => this.setPressedState('satellite')}
                >
                    <Text>Satellite</Text>
                </TouchableOpacity>
            </View>
        );
    }
}

Answer 1

要重新渲染组件，您需要使用官方文档中setState提到的方法，该方法表示：

通常，应在构造函数中初始化状态，然后在要更改状态时调用setState。

看到这个

setPressedState = (press) => {
    this.setState({pressed:press}, () => {
      Alert.alert(this.state.pressed)
    });
}