Comment réagir à un changement d'accessoire sans le rendre en utilisant mobx

Question

Je construis une application React + Mobx et j'ai une situation où j'ai un composant qui ne rend rien car tout est basé sur une API map tierce, mais je dois réagir à certains changements de propriété de magasin:

componentDidMount() { 
    mapApi.doSomething(this.props.store.value) 
} 

componentWillReact() { 
    mapApi.doSomething(this.props.store.value) 
} 

render() { 
    //workaround to make componentWillReact trigger 
    console.log(this.props.store.value) 
    return null 
} 

y at-il une façon élégante de mettre en œuvre ce?

Answer 1

Si je vous ai bien compris, vous voulez réagir à quelque chose qui ne sert pas à rendre la fonction. Vous pouvez faire quelque chose comme ceci:

@observer 
class ListView extends React.Component { 
    constructor(props) { 
     super(props) 
    } 

@observable filterType = 'all' 

handleFilterTypeChange(filterType) { 
    fetch('http://endpoint/according/to/filtertype') 
    .then() 
    .then() 
} 

    // I want the method that autoruns whenever the @observable filterType value changes 
hookThatDetectsWhenObservableValueChanges = reaction(
    () => this.filterType, 
    filterType => { 
     this.handleFilterTypeChange(filterType); 
    } 
) 
} 

Cette solution est mentionnée ici https://github.com/mobxjs/mobx-react/issues/122#issuecomment-246358153

Answer 2

Vous pouvez utiliser shouldComponentUpdate

shouldComponentUpdate() { 
    return false; // would never rerender. 
}