2015-10-07 2 views
1

Я использую реактивный маршрутизатор, и мне нужно передать реквизиты обработчику Comments (см. Код ниже). Обычно это solved by creating a wrapper component.Реактивный маршрутизатор: передайте опоры на компонент обработчика es6

BUT Comments уже является оберткой es6 AbstractComments, поэтому я не хочу создавать еще одну обертку. Так что я делаю это следующим способом:

Проблема/Вопрос: посмотрите пожалуйста на Comments#onChange метод

Комментарии компонента

// Where AbstractComment extends React.Component 
class Comments extends AbstractComments { 

    constructor(props) { 
     //Pass my custom props to component 
     super(_.assign(props, { 
      chatName: '....', 
      title: '...', 
      comments: '.....' 
     })); 
    } 

    _onChange() { 
     //PROBLEM: after setState Comments component get rendered 
     //without my custom props: (chatName, title, comments) 
     //QUESTION: how to re-render it with the same properties? 
     this.setState(someNewState); 
    } 

} 

Как Comments оказывает реактивный маршрутизатор:

var Index = React.createClass({ 
    render: function() { 
    return (
     <div> 
      <header>Some header</header> 
      <RouteHandler /> 
     </div> 
    ); 
    } 
}); 

var routes = (
    <Route path="/" handler={Index}> 
    <Route path="comments" handler={Comments}/> 
    <DefaultRoute handler={Dashboard}/> 
    </Route> 
); 

ReactRouter.run(routes, function (Handler) { 
    React.render(<Handler/>, document.body); 
}); 
+0

Очень простое решение - do 'Comments.defaultProps = {...}' вместо назначения их внутри конструктора –

ответ

0

Присвойте значения по умолчанию реквизитам в значениях по умолчанию, как показано ниже.

class Comments extends AbstractComments { 

    constructor(props) { 
    //Pass my custom props to component 
    super(_.assign(props, { 
     chatName: '....', 
     title: '...', 
     comments: '.....' 
    })); 
    } 

    _onChange() { 
    //PROBLEM: after setState Comments component get rendered 
    //without my custom props: (chatName, title, comments) 
    //QUESTION: how to re-render it with the same properties? 
    this.setState(someNewState); 
    } 

} 
Comments.defaultProps = {chatName: '....', 
     title: '...', 
     comments: '.....'}; 

export default Comments ; 
Смежные вопросы