在react native中如何使用json数据重复相同的渲染n次，请毫不犹豫地解释清楚

Question

here I am trying to repeat one view it contains image,icon,and some text using fab button on press with the help of json and for loop,if it is done it is going to execute or it will throw the errors,suggest best method to do this.

Answer 1

You could use the map function to repeat a component multiple times.

export default function AppExample({jsonList}) {

  const getCustomView = () => {
    return jsonList.map((item, index) => {
      return (
        <MyCostomView
          key={item.id}
          item={item}
        />
      );
    });
  };

  return (
      <View>
        {getCustomView()}
      </View>
  );
}

Here jsonList is an array of objects. MyCustomView is another component that includes your image text, use key with some unique id like image URL (if any).

Answer 2

use Flatlist for rendering view multitple times

 <FlatList
        data={DATA}
        renderItem={renderItem}
        keyExtractor={item => item.id}
      />

where data can be your JSON data and renderItem Will be your View that you want to repeat.

For detail, example check this