mobx가 관찰 가능한 데이터를 소품에 전달

Question

react-typescript 프로젝트에서 mobx를 사용합니다. 가져 오기 API를 사용하여이 클래스 설정 관측 배열 :

class MenuRepo { 
    @observable menuItems?: IMenuModel[];//=[{Id:1,itemName:"asd",childItems:[]}]; 
    @action getItems(): void { 
    fetch(`...`) 
     .then((response: { value: IMenuModel[] }): void => { 
     this.menuItems = [ 
      { Id: 1, itemName: 'test-item1', childItems: [] } 
     ]; 
     }); 
    } 

와 나는이 구성 요소 클래스에이 관측 데이터를 추적 할 :

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

하지만 PARAMS는 "정의"입니다. 나는 mobx &에 대한 튜토리얼을 보았지만 반응은 없었다.

여기 App.tsx 파일 :

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

Answer 1

이 MenuRepo instanceof를 asd입니까? 첫 번째 렌더링에서 menuItems는 정의되지 않습니다. 두 번째 렌더링을 생성해야하는 가져 오기가 해결 된 이후에만 첫 번째 값을 얻습니다.

App은 menuItems을 역 참조하는 것으로서 observer이어야합니다. (더 많은 정보 : https://mobx.js.org/best/react.html)