Как использовать React Native ListView с MobX?

Question

Я пытаюсь заполнить ListView в реакцию с родной наблюдаемой массиву MobX как так:

constructor(props) { 
     super(props) 
     var dataSource = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 }); 
     let dogs = props.store.dogs; 
     this.state = { dogs: dogs, dataSource: dataSource }; 
    } 

    render() { 

     var dogs = this.state.dogs; 
     var dataSource = this.state.dataSource.cloneWithRows(dogs); 

     return <ListView 
      dataSource={dataSource} 
      renderRow={this.renderRow} 
      /> 
    } 

Но при выполнении кода, renderRow() никогда не вызывается. Он вроде метода cloneWithRows() не знал, как клонировать строки.

У кого-нибудь это удалось? (А также заставить его вести себя, что когда имя собаки в списке собак изменений, то ячейка в списке будет повторно вынести)

Update: более информация здесь https://github.com/mobxjs/mobx/issues/476

Answer 1

Если я правильно помню, вам нужно обрезать собак (lol) dogs.slice(), так как в противном случае ListView не будет распознавать его как правильный массив. Возможно, компонент, созданный renderRow, также должен быть компонентом наблюдателя, поскольку он может быть вызван асинхронно.

Обратите внимание, что нарезка должна выполняться в методе render, а не в конструкторе; вы хотите, чтобы это происходило каждый раз, когда коллекция менялась, а не только при построении компонента.

См. Также: https://github.com/mobxjs/mobx/issues/476