В ReactJS + Flux поделитесь кнопкой сохранения со многими вкладками

У меня есть структура в ReactComponent, как

class MyComponent extends React.Component {
    render() { 
        return (
            <div class="row">
                <MyMenuComponentTab></MyMenuComponentTab>
                <Tab1></Tab1>
                <Tab2></Tab2>
                <Tab3></Tab3>
            </div>
            <div class="row">
                <button onClick={this.handleButton}>SAVE</button>
            </div>
        )
    }
}

В каждой вкладке вы можете создать независимую сущность в бэкэнде, и каждый компонент вкладки связан с его собственным магазином и действием во FLUX.

Мой вопрос: возможно ли сделать кнопку сохранения контекстной? Так что, если вы нажмете эту кнопку, она может обработать в функции "handleButton" действие и магазин связан.

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

1 ответ

Решение

Вы можете отслеживать активную вкладку в состоянии вашего MyComponent, Затем вы можете передать обратный вызов каждому Tab это изменяет состояние, чтобы отразить, какая вкладка активна. Таким образом, ваш handleButton функция будет нужна только для доступа this.state.activeTab обрабатывать действие сохранения в контексте.

Другие вопросы по тегам