1

Имеется код:

class MyName extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
        number: 0,
        name: 'Вася' + this.number
        }
    }
    rebder() {
      ...
    }

Не получается в локальном стейте присвоить свойству name число, из свойства number. Код не приведённый выше не работает. Как это сделать? Понимаю, что загвоздка скорее всего синтаксисе или контексте this, но решение так и не смог найти.

2 ответа 2

2

Основной вопрос тут: зависит ли name только от number, или позже будет изменяться отдельно.

Если name зависит только от number, то его лучше не делать стейтом.

Сделайте метод: getName(){ return 'Вася' + this.state.number }

В данном случае вычисление не дорогое, и повышается согласованность.

Для тяжелых вычислений можно использовать useMemo или его аналог.

Если name позже будет изменяться отдельно, то в конструкторе:

const number = 0
const name = 'Вася' + number
this.state = { number, name }
0

Конструктор по большей части определяет, какие названия стейтов будут у компонента, ну и их стандартное значение. Если нужно оперировать стейтами, можно это сделать в момент монтирования компонента например:

class MyName extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            number: 0,
            name: ''
        }
    }

    componentDidMount() {
        this.setState({
             name: 'Вася' + this.state.number
        })
    }

    render() {
      ...
    }

}

1
  • как-то, по-моему, перебор для такой простой вещи в лайфсайкл залезать 15 авг 2020 в 10:50

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.