ListView.DataSource 中 rowHasChanged 的​​确切输入是什么

2023-11-27

在 React Native 示例中,他们给了我们这段代码:

getInitialState: function() {
    return {
      dataSource: new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
      }),
      loaded: false,
    };
  },

但是,我似乎找不到任何描述 rowHasChanged 功能的简明文档。我们从哪里获得两个输入 row1 和 row2? ListView 中的 row1 和 row2 是由什么定义的?

我在这里查看了 Listview 的文档:http://facebook.github.io/react-native/docs/listview.html但我仍然不确定 rowHasChanged 的​​输入是什么定义的。


TL,博士;你必须定义rowHasChanged与您提供给数据源的数据相关。

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

在此特定示例中,r1 和 r2 将是一个字符串,因为 ds 有 2 个字符串行作为数据。


由您定义自己的数据格式并根据此实现 rowHasChanged. rowHasChanged基本上每次更改数据源行时都会为每个数据源行条目调用,然后只有更改的行才会重新呈现(当rowHasChangedtrue).

更高级的例子

假设我的数据源中有这种数据:

[
  { type: DOG, age: 12, name: "Snoopy" },
  { type: CAT, age: 13, name: "Oliver" },
  { type: HUMAN, age: 30, firstName: "Jerome", lastName: "Garcia" }
]

在我的示例格式中,“类型”是切换数据类型的必填字段,“年龄”是跨所有类型可用的字段,然后是特定字段。

然后我可以实现 rowHasChanged:

const rowHasChanged = (r1, r2) => {
  if (r1.type !== r2.type) return true;
  if (r1.age !== r2.age) return true;
  switch (r1.type) {
    case DOG:
    case CAT:
      return r1.name !== r2.name;
    case HUMAN:
      return r1.firstName !== r2.firstName || r1.lastName !== r2.lastName;
    default:
      throw new Error("Unsupported type "+r1.type);
  }
}

^ 这样,只有当一行确实根据我的格式发生变化时才会呈现。

(你可以想象我的 renderRow 函数也是带有开关类型的函数)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ListView.DataSource 中 rowHasChanged 的​​确切输入是什么 的相关文章

随机推荐