Mobx，过滤并取消移动@computed中的数组

Question

给定一个包含 id-name-propertyName 集合的可观察数组，我试图过滤掉一个必须绑定到 React 组件中的 html select 控件的国家/地区数组。我需要在我的 select html 元素中提供一个空的默认值。 'Country' 的过滤器效果很好，但是当添加 .unshift(empty) 部分时，我运行遇到了问题。

我的观察：

class ReferenceStore {
  @observable referenceData=[];

到目前为止我的@computed：

  @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 returns 数组的新长度，而不是数组本身。

您可以先 unshift，然后 return 数组。

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

  test.unshift(empty);

  return test; 
}

Mobx，过滤并取消移动@computed中的数组

Mobx, filter and unshift an array in @computed

arrays

reactjs

computed-properties

mobx