Реагировать компонент Rails: вручную вызывая повторное визуализации

Question

В Rails, у меня есть набор вкладок Bootstrap на странице с React компонентом на каждом из них, то есть:

<div id="tab-1" class="tab-pane"> 
    ... 
    <%= react_component('PeopleWidget', person_id: @person.id) %> 
    ... 
</div> 

<div id="tab-2" class="tab-pane"> 
    ... 
    <%= react_component('ContentWidget', content_id: @content.id) %> 
    ... 
</div> 

Компоненты:

• не разговаривайте друг с другом
• Обновление RESTful бэкенд

Сейчас:

• PeopleWidget может обновить права человека во внутреннем интерфейсе
• Это должно изменить ContentWidget только для чтения поведение на

Мой тактическое решение:

• На Bootstrap случае, когда tab-2 показано , Я хотел бы вручную запустить рендеринг ContentWidget.
• Это будет инициировать загрузки обновленных деталей из бэкэндом
• ContentWidget будет правильное поведение обновленного

Это чувствует, как обходной путь, но у меня есть график :)

Я не могу понять, как для ручного запуска ContentWidget для повторной обработки. Это возможно?

Answer 1

Вы можете использовать тактику от Flux: вы можете настроить приемник событий в компоненте, и когда происходит событие, повторная визуализация с использованием forceUpdate ,

В Flux компоненты слушают магазины. В вашем случае вы можете прослушать events triggered by Bootstrap tabs.

Например, для обработки события, когда язычок показано:

var ContentWidget = React.createClass({ 
    _handleTabShow: function() { 
     this.forceUpdate() 
     // any other reload/re-render code here, too 
    }, 

    componentWillMount: function() { 
     // start listening for show event: 
     $('#tab-2').on('shown.bs.tab', this._handleTabShow) 
    }, 

    componentWillUnmount: function() { 
     // clean up the handler when the component is removed: 
     $('#tab-2').off('shown.bs.tab', this._handleTabShow)  
    } 

    // The rest of your component code 
    // goes here.... 
}) 

Answer 2

Вы можете использовать forceUpdate, чтобы сделать компонент повторно вынести