Mobx, фильтровать и отменять смещение массива в @computed

Question

Учитывая наблюдаемый массив, содержащий коллекцию id-name-propertyName, я пытаюсь отфильтровать массив страны, который должен быть привязан к элементу управления html select в компоненте React. Мне нужно представить пустой по умолчанию в моем элементе выбора HTML. Фильтр 'Country' работает отлично, однако при добавлении .unshift (пустой) части у меня возникают проблемы.

Моя наблюдаемая:

class ReferenceStore {
  @observable referenceData=[];

Мой @ вычислен до сих пор:

  @computed get countries() {
    var empty = { id: 0, name: '' };
    var test = this.referenceData.filter(x => x.propertyName === "Country").unshift(empty);
    return test; 
  }

Проблема в том, что этот код приводит к появлению следующего сообщения об ошибке в моем компоненте:

ReferenceStore__.a.countries.map is not a function 

Как мне поступить об этом? Спасибо!

Answer 1

unshift возвращает новую длину массива, а не сам массив.

Вы можете сначала выполнить unshift, а затем вернуть массив.

@computed get countries() {
  var empty = { id: 0, name: '' };
  var test = this.referenceData.filter(x => x.propertyName === "Country");

  test.unshift(empty);

  return test; 
}