reactjs - mobx は変数を監視しない

Question

obv という配列の値を設定します。それを繰り返して、ブラウザでこのhtml出力が空白のページに表示されると予想していたjsx要素を作成します..

コードは次のとおりです。

    class App extends Component {
      constructor(props){
        super(props);
      }
      render() {
        const {socialJSX} = this.props.items?this.props.items.map((item)=> {
          return <a className={"icon32-"+item.Title} href={item.Link.Url} target="_blank" title={item.Description} />
        }):"";
        debugger
        return (
            <div id="socialWrapper">
        <div id="socialWrap">
          {socialJSX}
        </div>
      </div>
        );
      }

      componentWillMount () {
    fetch(`http://remoteurl`, {
      method: 'GET',
      headers: {
        'Accept': 'application/json;',
        'Content-Type': 'application/json'
      }}).then((response) => {
            return response.json();
          })
          .then((response) => {
            $.each(response.value,(index, value)=>{
              if(value){
                this.props.appState.addItem({
                  Title:value.Title,
                  Active:value.Active,
                  Description:value.Description,
                  Link:{Address:value.Link.Url, Description:value.Link.Description}
              });
              }
            });
          })=
      }
    }

export default observer(App);

index.js:

const appState = new AppState();

ReactDOM.render(
  <App appState={appState} />,
  document.getElementById('root')
);

appState.js

import { extendObservable, computed } from 'mobx';
class AppState {
    constructor() {
    extendObservable(this, {
      items: []
    });
  }
  addItem(item) {
    debugger
      this.items.push(item)
  }
}
export default AppState

アイテムにロードされたコンテンツ データを確認しました。問題は何ですか?