MobX httpでRest APIを呼び出してObservableを返す

Question

私はMobXを試しています。私の質問は

1. です.MobXにはhttpを組み込んでいますか？はいの場合、名前/機能は何ですか？
2. ＃1の答えがいいえ、私はアキシャスを使用していますが、解決された約束を私の観測可能なものに変換するにはどうしたらいいですか？

私は以下が間違っていることを知っています。これを達成するための一般的な方法は何ですか？

export class TodoStore { 
    @observable todos = []; 
    .... 
    fetchTodo() { 
    axios.get("http://rest.learncode.academy/api/reacttest/tweets") 
     .then((response) => { 
     response.data.map(item => { 
      this.todos.push(new Todo(item)); 
     }) 
     .catch((err) => { 
     .... 
     }); 
    }); 
    } 
} 

Answer 1

これは機能します。私はそれをテストしました。

TodoStore.js

class Todo { 
    @observable value 
    @observable id 
    @observable complete 

    constructor(value) { 
    this.value = value 
    this.id = Date.now() 
    this.complete = false 
    } 
} 

export class TodoStore { 
    @observable todos = [] 
    @observable filter = "" 
    @computed get filteredTodos() { 
    var matchesFilter = new RegExp(this.filter, "i") 
    return this.todos.filter(todo => !this.filter || matchesFilter.test(todo.value)) 
    } 
    ...... 
    fetchTodos() { 
    axios.get("http://rest.learncode.academy/api/reacttest/tweets") 
     .then((response) => { 
     console.log("in axios ", response.data) 
     response.data.map(item => { 
      console.log("in axios ", item) 
      this.todos.push(new Todo(item.text)); 
     }); 
     }) 
     .catch((err) => { 
     console.log("in axios ", err) 
     }) 
    } 
} 

TodoList.js

export default observer(
class TodoList extends React.Component { 
    componentWillMount() {    
    this.props.store.fetchTodos() 
    } 

    ........ 
    render() { 
    ........  
    return <div> 
     <h1>todos</h1> 
     ...... 
    </div> 
    } 
} 
)