mobx contenful simple api call

Question

mobx와 함께 기본적인 반응 앱 (CRA)을 가지고 있으며 만족스러운 공간의 모든 항목을 얻고 싶습니다.

단순한 저장소로 반응 콘솔에서 내 항목을 볼 수 있지만 구성 요소에 표시하는 방법을 찾을 수 없습니다.

class ProjetsStore { 

@observable projets = {} 

@action fetchAll(){ 
window.fetch(`${API_BASE_URL}/spaces/${API_SPACE_ID}/entries? 
access_token=${API_KEY}&content_type=projet`) 
.then(res => res.json()) 
.then(prj => this.projets = prj) 

구성 요소는 실제로는 매우 기본적인하지만 시도간에, 나는 단순히 도구 반응에 모든 this.props.projetsStore에 존재하는 경우에도 아무 것도 표시 할 수있는 방법을 찾을 수 없습니다. 누군가가 단순히 mobx와 함께 API에서 데이터를 가져올하고 공급 업체를 통해 소품으로 DISPO하기 위해 어떤 방향 또는 ressource 날 지점 수 있다면

@inject(['projetsStore']) 
@observer 

class Projets extends Component { 

componentDidMount() { 
    this.props.projetsStore.fetchAll() 
} 

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

, 그 좋지 않을까.

감사합니다.

Answer 1

mobx에 익숙하지 않아 상점 작동 방식이 확실하지 않지만 구성 요소 자체에 데이터를 설정해야한다고 생각합니까?

@inject(['projetsStore']) 
@observer 

class Projets extends Component { 

componentDidMount() { 
    this.props.projetsStore.fetchAll() 
    .then(data => this.setState({data}) 
} 

Answer 2

당신은 mobx-react 패키지에서 <Provider>하여 최고 수준의 구성 요소를 포장해야합니다.

<Provider projetsStore={projetsStore}> 
    <Projets /> 
</Provider> 

그런 다음 배열이 아닌 문자열을 사용하여 삽입하십시오.

@inject('projetsStore') 
@observer 
class Projets extends Component { 

componentDidMount() { 
    this.props.projetsStore.fetchAll() 
    }