彙總mobx奇淫技巧

簡化action屬性更新

一般狀況下,store中會有不少屬性,其中有些屬性更新會很頻繁,每個屬性都須要寫一個action函數去更新,當這種須要變動的屬性越多時,會致使store中代碼量異常的龐大,可讀性也會下降。就以下面代碼同樣:typescript

class TestStore {
  @observable info = {} as IInfo;
  
  @observable list = [] as IList;
  
  @action
  setInfo = (value: IInfo) => {
    this.info = value;
  }
  
  @action
  setList = (value: IList) => {
    this.list = value;
  }
}

引入typescriptkeyof關鍵字使用,能夠將上述action函數簡化以下:函數

class TestStore {
  @observable info = {} as IInfo;
  
  @observable list = [] as IList;
  
  @action
  setValue = <T extends keyof TestStore>(key: T, value: this[T]) => {
    this[key] = value;
  }
}
相關文章
相關標籤/搜索
本站公眾號
   歡迎關注本站公眾號,獲取更多信息