Task 3033

Этот сайт лучше всего просматривать в современном браузере с включённым JavaScript.

Task 3033

Alekseii

И тут что то не так ??

import React from 'react';

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            userName: 'John Doe'
        }
    }
    componentDidMount() {
        this.setState({userName: 'Jane Doe'});
    }
    render() {
        return <div> {this.state.userName} </div>
    }
}
export default App;```

Alekseii

salton

Та вроде все так... а можете попробовать без конструктора? просто:

    state = {
        userName: 'John Doe'
    }

amati

у вас пробелы по краям {this.state.userName}, что для реакта означает не рендер строки, а рендер массива: [" ", "Jane DOe", " " ]

salton

а если бы конструкция выглядела так??:

return <div>
    {this.state.userName}
</div>

Solomon

Можно изменить состояние через стрелочную функцию:

import React from 'react';

class App extends React.Component {
    constructor (props) {
        super(props);
        this.state = {
            userName: 'John Doe'
        }
    }
    componentDidMount() {
        this.handleCountIncrement();
    }
    handleCountIncrement = () => {
        this.setState({userName: 'Jane Doe'})
    }

    render() {
        return <div>{this.state.userName}</div>;
    }
}
export default App;