어떻게 mobx 관측자를 제어 할 수 있습니까?

Question

react-mobx에서 관찰자 기능을 사용할 때 문제가있었습니다. student 객체가 변경 될 때이 구성 요소를 다시 쓰게됩니다

import React from 'react'; 
import { observer } from 'mobx-react'; 

@observer 
class Test extends React.Component{ 
    render(){ 
    const { student } = this.props; // it's @observable object 

    return (
     <div>{student.name}</div> 
    ) 
    } 
} 

다음과 같은
내 소스 코드.
하지만 다시 렌더링 할시기를 제어하고 싶습니다.

간단히 말해,이 구성 요소가 다시 렌더링 될 때 시점을 파악하고 싶습니다.
(이는 student 구성 요소가 변경되었음을 의미합니다)
shouldComponentUpdate와 유사합니다.
그래서 shouldComponentUpdate를 사용하여 제어 할 수 있다고 생각했습니다. 하지만 작동하지 않습니다.

어떻게 제어 할 수 있습니까?
내가 원하는 마지막 결과는 다시 렌더링 할 때 student 구성 요소에 특정 매개 변수가있을 때 다시 렌더링하고 싶지 않다는 것입니다.

Answer 1

당신의 질문에 대답하려면, 실제로 shouldComponentUpdate 방법 패치 원숭이에 의해, (매우 해키) 그 일을하는 한 가지 방법이있다 :

말했다

@observer 
class Test extends React.Component { 

    constructor(props) { 
    super(props); 
    this.mobxShouldComponentUpdate = this.shouldComponentUpdate; 
    this.shouldComponentUpdate = this.customShouldComponentUpdate; 
    } 

    customShouldComponentUpdate = (props, ...args) => { 
    if (props.student === 'foo') { 
     return false; 
    } 
    return this.mobxShouldComponentUpdate(props, ...args); 
    } 

    render(){ 
    const { student } = this.props; // it's @observable object 
    return (
     <div>{student.name}</div> 
    ) 
    } 
} 

, 이것은 당신이 생각하는 표시는 일반적으로 당신의 잘못된 방식으로 데이터를 이상적으로는 구성 요소가 응용 프로그램의 현재 상태에 대한 순수한 렌더링 기능이어야합니다.

class Test extends React.Component { 
    render(){ 
    if (student.name === 'foo') { 
     return <div>Custom info</div> 
    } 
    return (
     <div>{student.name}</div> 
    ) 
    } 
} 

Answer 2

MWeststrate, MobX에 DEVS 중 하나가 추적 동작을 사용자 정의 할 수있는 방법이 없습니다 게시물

이 말했다. 전체적인 생각은 shouldComponentDidUpdate를 독자적으로 구현하면 안된다는 것입니다. 관측자는 렌더링의 마지막 실행에서 실제로 사용 된 관측 값에만 반응합니다 (위실을 반환하는 일부 if 문 뒤에있는 관측 가능하지 않도록). 이것을 사용자 정의 할 수 있다면 MobX의 기본 보장을 깨뜨릴 수 있습니다.보기는 항상 상태와 동기화되어 바람직한 상황이 아닙니다.

링크 : https://github.com/mobxjs/mobx-react/issues/230

왜 제어 할 것입니다 당신이 그 학생을 업데이트 연기 또는 한 번에 해제 도움 runInAction 모든 업데이트를 할 수 없어, 재 - 렌더링?