Не обновляется state, после перезаписи значений

Question

Пишу функцию на react.js, которая должна менять класс div-а, посредством смены значения state.

Столкнулся с такой проблемой, что согласно console.log значения перезаписывается, но state - остаётся без изменений, о чём свидетельствует неизменность классов в HTML и браузерное расширение.

class ThirdSection extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            classes: {
                print: 'print col-md-3 m-auto'
            }
        };
    }

    render() {
        let funcName = () => {
            console.log(this.state.classes.pint); // print col-md-3 m-auto
            this.state.classes.pint = 'hide';
            console.log(this.state.classes.pint) // hide
        }
        return (
            <button onClick={() => funcName()}>Change Value!</button>
            <div className={this.state.classes.print}>Some Content</div>
        )
    }
}

Answer 1

function ThirdSection(props){
        const [print,setPrint] = useState('print col-md-3 m-auto')
        return (
            <button onClick={ev => setPrint('hide')}>Change Value!</button>
            <div className={print}>Some Content</div>
        )
}

Ошибки:

опечатка pint/print
нельзя присваивать внутрь стейта, нужен set*(новое_значение)

Просто:

функциональные компоненты короче и ясней
если funcName не меняют, она const
onClick получает аргументом event

БЛОГ НА HUSL

Не обновляется state, после перезаписи значений

Ответы (1 шт):