レンダリングメソッドが観測可能な配列の更新で起動されていない

Question

Repoクラスのフェッチメソッドを使用してデータをロードしても、コンポーネントを渡すことができませんでしたが、実際にはオブザーバコンポーネントの再レンダリングを期待しています。どうぞ;

MenuComponent.tsx：

@observer 
@inject('params') 
class MenuComponent extends React.Component<{params?:IMenuModel[]}, {}> { 
    render() { 
    //params undefined. 
    var menuJSX : JSX.Element[] = this.props.params ? this.props.params.map((item:IMenuModel, i:number)=>{ 
     return (<li key={item.Id}>{item.itemName}</li>) 
    }):[]; 
    return render(){...} 

MenuRepo.tsx：

class MenuRepo { 
    @observable menuItems?: IMenuModel[]; 
    constructor() { 
    this.getItems(); 
    } 
    @action getItems(): void { 
    fetch(`..`).then((response: Response): Promise<{ value: IMenuModel[] }> => { 
     this.menuItems = [ 
      { Id: 1, itemName: 'test-item1', childItems: [] } 
     ];//property setted here.. 
    }) 
     } 
    } 
export default new MenuRepo; 

App.tsx。

import Menu from './components/MenuComponent'; 
import menuCodes from './components/MenuRepo'; 
class App extends React.Component<null, null> { 
    render() { 
    return (
     <div className="App"> 
     <Menu params = {menuCodes.menuItems}/> 
     </div> 
    ); 
    } 
} 
export default App; 

フェッチで観測可能フィールド（menuItems）を設定した後、jsxレンダリングメソッドが再レンダリングされませんでした。

Answer 1

ここ順序を逆にしてみてください...これまでこの

@observer 
@inject('params') 

から...

@inject('params') 
@observer 

from documentation: @Injectと@Observerの両方を使用する場合は、それらを適用することを確認してください正しい順序：オブザーバーは内側のデコレータで、外側を注入する必要があります。その間に別のデコレータがあるかもしれません。