Теги слияния Mailchimp в URL протокола измерения Google Analytics попадают

Пропустить реквизит для направления детей.

Посмотреть все другие ответы

Пропустить общие глобальные данные через дерево компонентов через контекст

Контекст предназначен для обмена данными, которые можно считать «глобальными» для дерева компонентов React, таких как текущий аутентифицированный пользователь, тема или предпочтительный язык. 1

blockquote>

Отказ от ответственности: это обновленный ответ, предыдущий использовал старый контекстный API

Он основан на принципе Consumer / Provide , Во-первых, создайте свой контекст

const { Provider, Consumer } = React.createContext(defaultValue);

Затем используйте через


  {children} /* potential consumers */

и


  {value => /* render something based on the context value */}

Все потребители, являющиеся потомками Провайдера будет повторно отображаться всякий раз, когда изменяется значение поддержки поставщика. Распространение от Провайдера к его Потребителям-потомкам не подлежит методу shouldComponentUpdate, поэтому потребитель обновляется даже тогда, когда компонент-предок освобождается от обновления. 1

blockquote>

Полный пример, полу-псевдокод.

import React from 'react';

const { Provider, Consumer } = React.createContext({ color: 'white' });

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: { color: 'black' },
    };
  }

  render() {
    return (
      
        
      
    );
  }
}

class Toolbar extends React.Component {
  render() {
    return ( 
      

Consumer can be arbitrary levels deep

{value =>

The toolbar will be in color {value.color}

}
); } }

1 https://facebook.github.io/react/docs/context. HTML

1
задан McJ Digital 13 July 2018 в 23:27
поделиться