ответить native: как отменить регистрацию слушателя/службы?

Question

У меня есть список предметов. Каждый предмет может отображаться в MyComponent, передавая его itemId. Для прослушивания на изменениях выбранного пункта, я передаю myService:

<MyComponent myService={myService} id={itemId}/> 

компонент извлекает сведения об элементе и начинает слушать службу:

componentDidMount() { 
    this.fetchItemDetails(this.props.id); // fetch the item details 

    this.props.myService.listensTo('eventId',() => { 
     // something changed, fetch again ... 
    }); 
} 

componentWillUnmount() { 
    // reset/unregister the listener for this instance 
} 

Проблема: слушатель зарегистрирован каждый раз я монтирую MyComponent, что становится проблемой с несколькими экземплярами.

Я хочу прослушать только активный, смонтированный компонент и unlisten, как только он будет размонтирован.

Любые идеи?

Заранее благодарен!

Answer 1

Вы должны сохранить ссылку на функцию, которую используете в качестве обратного вызова. Обычно, что прослушиватели событий поддерживают внутреннюю структуру всех функций обратного вызова, которые необходимо вызывать, когда происходит событие, и поэтому, когда вы хотите прекратить прослушивание, вы должны сообщить диспетчеру событий, который является функцией, которая должна быть исключены из списка. Поскольку единственное, что дает вам эту информацию, - это ссылка на функцию обратного вызова. Я хотел бы сделать следующее:

constructor(){ 
    super(); 
    this.myListener = this.myListener.bind(this); // Do this only if necessary 
} 

componentDidMount() { 
    this.fetchItemDetails(this.props.id); // fetch the item details 

    this.props.myService.listensTo('eventId', myListener); 
} 

myListener(){ 
    //... 
} 

componentWillUnmount() { 
    // reset/unregister the listener for this instance 
    this.props.myService.deregister('eventId', myListener); 
} 

Важно, чтобы сохранить ссылку на функцию, поэтому важно поставить связывание в конструкторе.