Является ли прохождение всего состояния по компоненту реакции хорошей схемой?

Question

Документация Flux гласит, что:

Мы часто передаем все состояние магазина по цепочке представлений в одном объекте, что позволяет различным потомкам использовать то, что им нужно. В дополнение к поддержанию поведения, подобного контроллеру, на вершине иерархии и, таким образом, к поддержанию наших дочерних представлений настолько функционально чистыми, насколько это возможно, передача всего состояния хранилища в одном объекте также имеет эффект уменьшения количества реквизитов. нам нужно управлять.

В этом псевдокоде (иллюстрирующем прохождение всего хранилища в соответствии с рекомендациями документации Flux) интерфейсы компонентов, по-видимому, не очень хорошо определены.

function header (state) {
    profileLink(state);
    navigation(state);
}

function postList (state) {
    ul(state);
}

function footer (state) {
    div(state.copyright);
}

function rootComponent () {
    var state = getState();
    header(state);
    postsList(state);
    footer(state)
}

Разве следующий пример (с более конкретным интерфейсом компонентов) больше не соответствует парадигме функционального программирования?

function header (userName, navigationItems) {
    profileLink(username);
    navigation(navigationItems);
}

function postList (posts) {
    ul(posts);
}

function footer (copyright) {
    div(copyright);
}

function rootComponent () {
    var state = getState();
    header(state.user.name, state.navigation.items);
    postsList(state.posts);
    footer(state.copyright);
}

Вопрос в том, не является ли прохождение всего состояния по иерархии компонентов анти-паттерном?

Answer 1

Я думаю, что он имеет в виду, что иногда бывает удобно передать все состояние одного конкретного магазина детям. Это имеет смысл, если все дети связаны с магазином. Например:

function rootComponent(userState, bookState){
  bookTitle(bookState);
  bookDescription(bookState);
  bookPrice(bookState);
}

bookTitle(bookState) {
  div(bookState.title)
  div(bookState.author)
}

bookDescription(bookState) {
  div(bookState.description)
}

bookPrice(bookState) {
  div(bookState.price)
}

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