Реакция компонента как классического объекта

Я хотел бы иметь объект User, который будет реагировать на компонент, чтобы он мог, например, сделать его профилем. Но я также хотел бы получить доступ к его состоянию, сформировать другие компоненты, когда это необходимо. Я хочу определить некоторые методы, которые будут работать как getter. Так что я хотел бы сделать что-то вродеРеакция компонента как классического объекта

const User = module.exports = React.createClass({ 
     propTypes: { 
       GoogleUser: React.PropTypes.object 
     }, 
     getInitialState(){ 
       return { 
         name: 'John Doe', 
         email: '[email protected]', 
         id: 123 
       }; 
     }, 
     render(){ 
       return '<span>'+this.state.name+'</span>'; 
     }, 

     Profile(){ 
       return { 
        name: this.state.name, 
        email: this.state.email 
       }; 
     } 
});

Но когда я прохожу созданный элемент в качестве аргумента и доступа к методу Profile() это не определено. Как я могу сделать это так, чтобы доступ к пользователю был прямым и как можно меньше кодирования?

источник

2016-02-19 Márius Rak

Это точный код вашего компонента React? Это похоже на сочетание синтаксиса ES6 'class' (объявления метода) и синтаксиса ES5 (' React.createClass ({...}) '). –

Не точные, но все конструкции одинаковые. Я использую в своем коде вещи как render() {}, и он работает. Но я тоже был удивлен, когда узнал, что могу это сделать: D –

Я по-прежнему оглядываюсь на все новые синтаксисы ES6! Много сюрпризов. –

Есть два способа добиться этого. Самым идиоматичным является передача слушателя изменений на ваш компонент, который будет уведомляться при изменении состояния компонента.

Основная идея заключается в том, что вы передаете поддержку обратного вызова вашему компоненту и обновляете этот обратный вызов всякий раз, когда изменяется состояние. Таким образом, у вас было бы что-то вроде

Другой способ выполнения этой задачи - открыть функцию и получить доступ к ней с помощью ссылок. См. Expose Component Functions в документах React. Этот путь ближе к коду, который вы вставили выше, но он менее часто используется и немного отличается от парадигмы React. Мое предложение состоит в том, чтобы действительно попытаться сделать метод обратного вызова работать с вашей архитектурой приложения и только если вы уверены, что это не правильное решение для работы с подходом к компонентам функций.

источник

2016-02-19 19:45:59

Реакция компонента как классического объекта

ответ

Смежные вопросы