Question

我有一小部分简单对象，其中包含以下键：位置（左/右），最后一个。 last属性确定对象是否是特定位置的最后一个元素。

例如，集合可以如下所示：

[{position: 'left', last: false},
{position: 'left', last: false},
{position: 'left', last: true},
{position: 'right', last: false},
{position: 'right', last: true}]

将新对象添加到集合时，如果需要，我会更改上一个对象。

现在我可以回答我的问题，为什么更改的行不会被重新渲染？这是我的ListView配置：

dataSource: new ListView.DataSource({
    rowHasChanged: (r1, r2) => r1 != r2
})

更新列表的方法

_updateList(messages) {
    messages = messages.map((row, index) => {
        let last = false;
        let next = messages[index+1];
        if((next != undefined && next.position != row.position) || next == undefined)
            last = true;

        row.last = last;
        return row;
    });

    var rowIds = messages.map((row, index) => index).reverse();

    this.setState({
        messages: messages,
        dataSource: this.state.dataSource.cloneWithRows(messages, rowIds)
    }, () => {
        console.log(this.state.dataSource);
    });
}

渲染组件

<ListView
    renderScrollComponent={props => <InvertibleScrollView {...props} inverted />}
    dataSource={this.state.dataSource}
    style={{flex: 1, padding: 4*vw}}
    renderRow={(data) => <Message {...data}/>}
/>

ListView不会重新呈现已更改的行

0 个答案: