Что делает три точки в ReactJS

const peopleList = this.state.people.map( x => { return  }) 

Что означает «{… x}» этот код?

Это синтаксис оператора распространения в реакции.

Из MDN DOCS :

Синтаксис распространения позволяет расширить выражение в местах, где ожидаются несколько аргументов (для вызовов функций) или нескольких элементов (для литералов массива) или нескольких переменных (для назначения деструктуризации).

В вашем случае Это означает, что отправляет весь объект или свойства, содержащиеся в x поскольку он выглядит как реквизиты Person Component

Например, если

 var x = { name: "Hello", last_name: "World" } 

Затем, если вы выполните

Вышеуказанное будет эквивалентно

  

Также значителен порядок, в котором используется синтаксис распространения наряду с реквизитами.

Рассмотрим случай, когда вы передаете реквизиты компоненту, подобному

 var data = { name: 'abc', age: '25', college: 'lmit' } 

и если вы используете синтаксис оператора распространения, например

   

Затем prop name='xyz' перезаписывается парой ключ: значение, разрешенное из данных. Таким образом, окончательный вызов компонента Person будет выглядеть так:

   

Однако, когда вы пишете это как

   

Тогда name='abc' prop name='abc' , которое разрешено из данных, перезаписывается name='xyz' , которое явно передается Person . Таким образом, окончательный вызов компонента Person будет выглядеть так:

   

Это оператор распространения. Он был введен в ES2015. Он принимает все свойства x и распределяет их по элементу.

{...x} означает, что все свойства назначены объекту x, затем назначьте их

Вы можете прочитать больше здесь:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator

  • Как указать порт для запуска проекта, основанного на создании приложения-приложения?
  • Вложенные маршруты и динамическая маршрутизация в React-router v4
  • React.js - Синтаксическая ошибка: это зарезервированное слово в функции render ()
  • Можете ли вы заставить компонент React перезапустить без вызова setState?
  • responsejs, дающий ошибку Uncaught TypeError: Супер выражение должно быть либо null, либо функцией, а не неопределенной
  • Невозможно использовать функции Arrow внутри classа реагирующих компонентов
  • Каков наилучший способ запуска события onchange в реакции js
  • Динамически импортировать изображения из каталога с помощью webpack
  • Использовать состояние или refs в компонентах формы React.js?
  • Программно перемещаться с помощью реактивного маршрутизатора V4
  • Используйте функции жизненного цикла componentWillMount или componentDidMount для запроса async в React
  • Interesting Posts

    32-битное беззнаковое умножается на 64 бит, вызывая неопределенное поведение?

    Что означает селектор CSS>> (больше, чем знак)?

    Нет необходимости экспортировать при запуске функций в подоболочке

    Получение телефонного кода в США с помощью Android

    Есть ли простой способ сравнить, насколько близки два цвета друг к другу

    AngularJS: Ошибка при сбое: Не удалось создать экземпляр модуля?

    Почему / как svchost.exe использует 6.5 ГБ памяти?

    Как скопировать таблицу Lua по значению?

    Избавление от диалогового окна «Windows проверяет решение этой проблемы»

    Должен ли я вызвать Close () или Dispose () для объектов streamа?

    Передайте массив целых чисел в ASP.NET Web API?

    Блокировка объявлений наведите курсор

    Как изменить поведение перетаскивания по умолчанию на OS X?

    Вернуть тип instancetype в Swift

    Работа с несколькими пользовательскими шаблонами таблиц, исключающими повторяющийся код

    Давайте будем гением компьютера.