Обновить состояние при изменении другого состояния - PullRequest
Новая
       24

Обновить состояние при изменении другого состояния

0 голосов
/ 04 августа 2020

Допустим, у меня есть список продуктов, которые можно отфильтровать по type, когда пользователь выбирает другой type из раскрывающегося списка (есть и другие фильтры, которые пользователи могут установить, но они не имеют отношения к этому примеру) .

У меня есть состояние A, которое содержит отфильтрованные в настоящее время продукты. Состояние B содержит текущий выбранный тип.

Когда пользователь меняет тип, я хочу, чтобы он также обновлял текущие отфильтрованные продукты.

Как правильно это сделать?

  • Я мог бы вызвать действие 'set' для State A из State B всякий раз, когда State B установлен
  • Я мог бы вызвать действие 'set' как для State A, так и для State B, когда пользователь устанавливает State B
  • Я мог бы слушать State B в State A и обновлять State A, когда State B изменяется
  • Я мог бы просто иметь тип в State A, но я использую этот тип для других отдельных состояния и для других функций

1 Ответ

1 голос
/ 04 августа 2020

Предполагая, что вы не хотите / не можете выбрать значение type в состоянии A, я бы предложил Selector в состоянии A, которое зависит от значений состояния B.

In состояние A: 

@Selector([StateB])
static filterProducts(stateA: StateAModel, stateB: StateBModel) { 
  return stateA.products.filter(p => p.type === stateB.type);
}

Оно будет переоцениваться при изменении состояния B (или состояния A по умолчанию в текущей версии NGXS). Еще один усовершенствованный способ - иметь селектор типа в состоянии B.

В состоянии B: 

static @Selector()
selectedType(state: StateBModel) { 
  return state.type;
}

Затем использовать этот селектор в состоянии A: 

@Selector([StateB.selectedType])
static filterProducts(stateA: StateAModel, selectedType: any) { 
  return stateA.products.filter(p => p.type === selectedType);
}

Таким образом, селекторы будут срабатывать при изменении состояния, и вам не нужно добавлять дальнейшие действия.

...