相关疑难解决方法(0)

如何在ListView中添加/删除项目?

我们可以像这样为ListView创建数据源

var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});  
var dataSource =  ds.cloneWithRows(['row 1', 'row 2']), };
Run Code Online (Sandbox Code Playgroud)

但是,如果我想添加项目或从数据源中删除项目,我该怎么做?我是否需要始终使用更新的数组调用cloneWithRows?

react-native react-native-listview

30
推荐指数
2
解决办法
2万
查看次数

ListView删除dataSource更新上的错误行

当我使用新的部分和行更新状态时,我有一个React Native ListView似乎正在删除UI中的错误行 - 我删除的行保留,但是下面的那个,有时甚至是2,直到我重新加载应用程序.

我究竟做错了什么?

constructor(props) {
  super(props)

  this.state = {
    dataState: DataState.STATE_NOT_LOADED,
    dataSource: new ListView.DataSource({
      rowHasChanged: (r1, r2) => r1.identifier !== r2.identifier,
      sectionHeaderHasChanged: (s1, s2) => s1 !== s2
    })
  };
}

componentDidMount() {
  this.loadData();
}

loadData() {
  this.setState({
    dataState: DataState.STATE_LOADING
  });

  User.getDocs()
    .bind(this)
    .then(results => {
      var docs = _.groupBy(results, function (d) {
        return d.createdAt.format('MMMM D');
      });

      this.setState({
        dataState: DataState.STATE_LOADED,
        dataSource: this.state.dataSource.cloneWithRowsAndSections(docs)
      });
    })
    .catch(error => {
      console.log(error);

      this.setState({
        dataState: DataState.STATE_ERROR
      });
    });
}

onTrackPressed(doc) {
  User.untrackDoc(doc) …
Run Code Online (Sandbox Code Playgroud)

reactjs react-native

6
推荐指数
1
解决办法
2137
查看次数

React native:从ListView中删除项目

0.12.0在Android上使用React Native()并在我的页面上有一个ListView组件.我希望能够从列表中删除项目.

这个ListView看起来像这样:

<ListView
    dataSource={this.state.dataSource}
    renderRow={this._renderStory}
    onEndReached={this._getStories}
    />
Run Code Online (Sandbox Code Playgroud)

rowHasChanged方法看起来像这样.

this.state = {
    dataSource: new ListView.DataSource({
        rowHasChanged: (row1, row2) => {
            return row1 !== row2;
        },
    }),
    loaded: false,
};
Run Code Online (Sandbox Code Playgroud)

所有这一切都很好.

现在,要删除一个项目,我有这个代码:

var indexOfItem = this._data.findIndex((item) => item.id === story.id);
this._data.splice(indexOfItem, 1);

this.setState({
    dataSource: this.state.dataSource.cloneWithRows(this._data),
});
Run Code Online (Sandbox Code Playgroud)

我可以确认该项目正在从中删除this._data.this.state.dataSource._cachedRowCount应该减少一个.正在更新状态并触发渲染周期.但该项目不会从页面中删除.更重要的是,如果我放入控制台登录this._renderStory(),唯一发生的事情就是在列表底部呈现一个行.

我错过了什么吗?我还需要做另一个步骤吗?

这里也提出了类似的问题,但他从来没有得到关于删除一行的答案.如何在ListView中添加/删除项目?

我在这个地方看到的所有其他例子都没有删除项目的例子.

更新:谢谢,它需要传递数组的克隆并设置一个键(抱歉只能接受一个答案).但这意味着整个清单正在呈现.最后,我只是在项目上设置了一个'removed'属性,测试了该属性的变化,如果一个项目被标记为remove,则在render方法中返回null,这比重新渲染所有项目更快.

react-native

5
推荐指数
1
解决办法
8966
查看次数