Squeak.ru - шаблоны программирования

Почему некоторые люди используют состояние вместо this.state при определении компонента React?

Я видел разные примеры, когда одни люди используют состояние, а другие используют this.state. Я до сих пор не понимаю, когда что использовать. В примерах с использованием Mapbox или Meteor я вижу только this.state.

ex1:

export default class SomeComponent extends Component {
    state = { someState }
    render() {
        return (
          <Something-to-render-that-uses-state>
        );
    }
}

ex2:

export default class SomeComponent extends Component {
    constructor(props) {
        super(props);
        this.state = { someState }
    }
    render() {
        return (
          <Something-to-render-that-uses-state>
        );
    }
}

Ответы:


1

когда вы определяете переменную в классе как инициализированное свойство класса объекта, вам не нужно использовать это ключевое слово, достаточно просто написать state = { someState }. Однако, если вы хотите определить переменную класса в функции или конструкторе, вам нужно используйте ключевое слово this, чтобы указать, к какой области принадлежит переменная

export default class SomeComponent extends Component {
    constructor(props) {
        super(props);
        this.state = { someState }
    }

    render() {
        return (
          <Something-to-render-that-uses-state>
        );
    }
}
04.06.2018

2

Объявление state = {} — это свойство класса, которое в настоящее время не является частью языка JavaScript. Некоторые утилиты, такие как Babel, компилируют это в допустимый код JavaScript.

Так что это точно то же самое. Взгляните на JavaScript, в который Babel транспилирует код. Нет никакой разницы.

04.06.2018
Новые материалы

Угловая структура архитектуры
Обратите внимание, что эта статья устарела, я решил создать новую с лучшей структурой и с учетом автономных компонентов: https://medium.com/@marekpanti/angular-standalone-architecture-b645edd0d54a..

«Данные, которые большинство людей используют для обучения своих моделей искусственного интеллекта, поставляются со встроенным…
Первоначально опубликовано HalkTalks: https://hacktown.com.br/blog/blog/os-dados-que-a-maioria-das-pessoas-usa-para-treinar-seus-modelos-de-inteligencia-artificial- ja-vem-com-um-vies-embutido/..

Сильный ИИ против слабого ИИ: различия парадигм искусственного интеллекта
В последние годы изучению и развитию искусственного интеллекта (ИИ) уделяется большое внимание и прогресс. Сильный ИИ и Слабый ИИ — две основные парадигмы в области искусственного интеллекта...

Правильный способ добавить Firebase в ваш проект React с помощью React Hooks
React + Firebase - это мощная комбинация для быстрого и безопасного создания приложений, от проверки концепции до массового производства. Раньше (знаете, несколько месяцев назад) добавление..

Создайте API с помощью Python FastAPI
Создание API с помощью Python становится очень простым при использовании пакета FastAPI. После установки и импорта вы можете создать приложение FastAPI и указать несколько конечных точек. Каждой..

Веселье с прокси-сервером JavaScript
Прокси-серверы JavaScript — это чистый сахар, если вы хотите создать некоторую общую логику в своих приложениях, чтобы облегчить себе жизнь. Вот один пример: Связь клиент-сервер Мы..

Получить бесплатный хостинг для разработчиков | Разместите свой сайт за несколько шагов 🔥
Статические веб-сайты — это веб-страницы с фиксированным содержанием и его постоянным содержанием. Но теперь статические сайты также обрабатывают динамические данные с помощью API и запросов...