React Native - Изменение состояния, но компонент не перерисовывается - PullRequest
2 голосов
/ 06 мая 2019

Я создаю меню для изменения типа API Карт Google, но нажатое состояние не работает, как я планировал. Обратите внимание, что состояние внутри компонента Text не перерисовывается после изменения 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>
        );
    }
}

Ответы [ 2 ]

5 голосов
/ 06 мая 2019

Для повторного рендеринга компонента вам необходимо использовать метод setState, как указано в официальной документации , в которой говорится:

В общем случае вам следует инициализировать состояние в конструкторе, а затем вызывать setState, когда вы хотите его изменить.

Смотрите это,

setPressedState = (press) => {
    this.setState({pressed:press}, () => {
      Alert.alert(this.state.pressed)
    });
}
0 голосов
/ 06 мая 2019

Это не правильный способ, которым вы занимаетесь, вы не должны принимать состояние, как любые другие переменные, которые вы используете, и использовать оператор присваивания,

В реакции на переменные и константы вы можете использовать оператор присваивания, но вслучай состояния, которое вы должны использовать.

setState({
stateVariable:NewValue 
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...