1. 程式人生 > >ReactNative ListView改變資料來源,列表不重新整理

ReactNative ListView改變資料來源,列表不重新整理

ListView開始時的資料來源:

dataArr = [ 'ROW0',
            'ROW1',
            'ROW2' ]

然後我改變資料來源,重新整理沒反應。當然如何你刪除或者增加一組資料是可以的。

dataArr[0] = "hello,改變了第一行的資料"
this.setState({
        dataSource: this.state.dataSource.cloneWithRows(dataArr)
    })

原因:這樣賦值陣列只是淺拷貝,雖然改變了陣列,但是listView的資料來源也改變了,所以rowHaschange接收到的前後資料確實是一樣的。不會重新整理、

解決辦法

方法1:


    dataSource: this.state.dataSource.cloneWithRows(JSON.parse(JSON.stringify(dataArr)))    

方法2:js的slice函式,擷取陣列的一段。


    let newDataArr = dataArr.slice(0)
    newDataArr[0] = "hello,改變了第一行的資料"
    this.setState({
        dataSource: this.state.dataSource.cloneWithRows(newDataArr)
    })        

方法3:js的concat方法,拼接陣列。


    var newDataArr = dataArr.concat()
    newDataArr[0] = "hello,改變了第一行的資料"
    this.setState({
        dataSource: this.state.dataSource.cloneWithRows(newDataArr)
    })