0

为什么我recyclerlistview没有被重新渲染?

import React, { useState } from 'react';
import {
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
  Image,
  Dimensions,
} from 'react-native';

import pure from 'recompose/pure';
import {
  RecyclerListView,
  DataProvider,
  LayoutProvider,
} from 'recyclerlistview';
import faker from 'faker';

const width = Dimensions.get('window').width;

const Table = () => {
  const [x, setX] = useState({ update: false });
  const fakeData = [];

  for (let i = 0; i < 100; i += 1) {
    fakeData.push({
      type: 'NORMAL',
      item: {
        id: i,
        image: faker.image.avatar(),
        name: faker.name.firstName(),
        description: faker.random.words(5),
      },
    });
  }

  const [dataprovider0, setDataProvider0] = useState(
    new DataProvider((r1, r2) => r1 !== r2).cloneWithRows(fakeData)
  );

  const [layoutprovider0, setLayoutProvider0] = useState(
    new LayoutProvider(
      (i) => {
        return dataprovider0.getDataForIndex(i).type;
      },
      (type, dim) => {
        switch (type) {
          case 'NORMAL':
            dim.width = width;
            dim.height = 95;
            break;
          default:
            dim.width = 0;
            dim.height = 0;
        }
      }
    )
  );

  const rowRenderer = (type, data) => {
    const { name, image } = data.item;
    return (
      <View>
        {x.update === false ? <Text>{name}</Text> : <Text>NULL</Text>}
      </View>
    );
  };

  return (
    <View style={styles.container}>
      <TouchableOpacity
        onPress={() =>
          setX((prevState) => {
            return {
              ...prevState,
              update: !prevState,
            };
          })
        }>
        <Text>Heloooooo</Text>
      </TouchableOpacity>
      <RecyclerListView
        style={{ flex: 1 }}
        rowRenderer={rowRenderer}
        extendedState={x}
        dataProvider={dataprovider0}
        layoutProvider={layoutprovider0}
      />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    width,
  },
});

export default pure(Table);
4

0 回答 0