Блог

Я использую библиотеку react-native-scrollable-tab-view для просмотра вкладок.

VideoScreen hook componet BasicView просмотр вложенной вкладки hook componet.

Видеоэкран:

 import ScrollableTabView from 'react-native-scrollable-tab-view';
import BasicView from './BasicView';

VideoScreen = () => {
  return (
    <ScrollableTabView>
      <BasicView tabLabel={"Basic"} />
    </ScrollableTabView>
  );
};

export default VideoScreen;
 

BasicView:

 BasicView = () => {

// basicVideos is my list array data.

const renderVideos = ({item}) => {
  const {id} = item;

  return (
    <View>
      <Text>{id}</Text>
    </View>
  );
};

return (
    <View>
      <View style={{height: 16}} />
      {basicVideos.map((value, index) => {
        const {id, videos, title} = value;

        return (
          <View key={index} style={{marginBottom: 20}}>
            <Text style={styles.categoryTitle}>{title}</Text>
            <FlatList
              style={styles.flatSection}
              showsHorizontalScrollIndicator={false}
              horizontal={true}
              data={videos}
              renderItem={renderVideos}
              keyExtractor={(item, index) => index.toString()}
            />
          </View>
        );
      })}
    </View>
  );
}

export default BasicView;
 

Код показывает Warning: Something is calling a React component directly. Use a factory or JSX instead , что если я удаляю <FlatList /> , предупреждение исчезает,
но я не знаю почему. Как мне исправить это предупреждение?