Почему компонент React не обновляется при изменении реквизита?

Question 1

function Greeting(props){     
    return <h1>{props.name}</h1>;
}  

var name = "Henok"; 

setTimeout( () => {name="Rahel";},2000);

ReactDOM.render(<Greeting name={name} />, document.getElementById('root'));

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

Несмотря на то, что я сменил имя на Рахеля, я не мог видеть сообщение Rahel в браузере?

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

Question 2

Хенок, похоже, что вы меняете стоимость вне React! Вы можете сделать что-то вроде этого:

class Greeting extends Component{
    state ={
        name: 'henok'
    }

    componentDidMount(){
       setTimeout(()=> this.setState({name:'Rachel'}), 3000)
    }

    render(){
       const {name} = this.state;
       return(<p>Hello {name} </p>);
    }
}

Dupocas · Answer 1 · 15 August 2018 в 17:04

Хенок, похоже, что вы меняете стоимость вне React! Вы можете сделать что-то вроде этого:

class Greeting extends Component{
    state ={
        name: 'henok'
    }

    componentDidMount(){
       setTimeout(()=> this.setState({name:'Rachel'}), 3000)
    }

    render(){
       const {name} = this.state;
       return(<p>Hello {name} </p>);
    }
}

0

ответ дан Dupocas 15 August 2018 в 17:04

1

Спасибо @ Dupocas. Да, мы можем сделать так, как делаю, но я хочу знать причину, по которой она не работает. – Henok Tesfaye 13 August 2018 в 16:25
2

Причина Реагирующие элементы неизменяемы. Создав элемент, вы не сможете изменить его дочерние элементы или атрибуты. Если вы действительно хотите обновить свои компоненты вне экосистемы React, вы должны снова вызвать ReactDOM.render() внутри setTimeout(). Что-то вроде этого: setTimeout( () => ReactDOM.render(<Greeting name={'Rahel'} />, document.getElementById('root')); ,2000); – Dupocas 13 August 2018 в 17:11
3

@HenokTesfaye Потому что это не так, как React предполагается работать. Он не использует, скажем, наблюдаемые, чтобы посмотреть на более крупную систему. Он использует рендеринг и состояние для определения необходимости повторной рендеринга. – Dave Newton 13 August 2018 в 20:21

Почему компонент React не обновляется при изменении реквизита?

1 ответ

Другие вопросы по тегам:

Похожие вопросы: