如何 return 来自 api 的 JSON 中的随机数据

How to return a random data in JSON from an api in react native

我有一个从 API 获取数据的函数。我想从数据中return一个随机数据。我已经尽我所能,但似乎没有解决办法。下面是从 API.

调用 JSON 数据的函数

const fetchLastestPost = async () => {
        const response = await fetch(
            `https://learnersnews.com/wp-json/wp/v2/case?per_page=10&page=${page}`,
        );
        const post = await response.json();
        if (page == 1) {
            setPosts(post);
         
        } else {
            setPosts([...posts, ...post]);
           
        }
        setIsFetching(false);
        setIsLoading(false)
    }

下面是Flatlist组件

 <FlatList 
               data={posts}
                onRefresh={() => onRefresh()}
                refreshing={isFetching}
                onEndReached={() => handleLoadMore()}
                onEndReachedThreshold={0.1}
                showsVerticalScrollIndicator={false}
                ListFooterComponent={() => renderFooter()}
                renderItem={({ item }) => (
                 
                  <TouchableOpacity activeOpacity={0.8} onPress={() =>
            navigation.navigate('Singlecase', {
                post_id: item.id,
                name: item.title.rendered,
            })
        }>
       
          <View>
          
                <Card>
            <CardItem header bordered style={{ paddingTop:8, paddingBottom: 8,}}>
              <Text  numberOfLines={2} 
            ellipsizeMode='tail'  style={styles.titleText} >
            {item.title.rendered}</Text>
            </CardItem>
           
            <CardItem bordered style={{ paddingTop:1, paddingBottom:1 }}>
            
        <HTML html={item.excerpt.rendered}  />
              </CardItem>
            <CardItem footer bordered >
            <View style={{ flexDirection: 'row',
        flexWrap: 'wrap',}} >
           
              <Text  numberOfLines={1} style={{ color: "red" ,fontFamily: "Lato-Regular", }}>Nigeria 
              <Text style={{ color: "black",  }}> | <Text style={{fontFamily: "Lato-Regular", color: "blue",  }}>{item.acf.court}<Text style={{ color: "black",fontFamily: "Lato-Regular" }}> |</Text> {item.acf.year} <Text style={{ color: "black",fontFamily: "Lato-Regular", }}> | </Text>{item.acf.Area}</Text> </Text> </Text> 
              </View>
       
            </CardItem>
          </Card>
          </View>
          
          </TouchableOpacity>
          
          )}

          onScroll={(e)=>{
          scrollY.setValue(e.nativeEvent.contentOffset.y) 
      }}
          ListHeaderComponent={

<View>
       
 <Segment style={{marginTop:51}}>
<Button first style={{borderRadius:5, marginRight:3, backgroundColor: '#f0f0f0',}}
 onPress={() => navigation.navigate('Prin')}>
<Text style={{color:"black",fontFamily: "Lato-Regular", }}>Search by Law Report</Text>
</Button>

         
         
<Button last style={{borderRadius:5, marginLeft:3, backgroundColor: '#f0f0f0', }}
onPress={() => navigation.navigate('Area')}>
<Text style={{color:"black",  fontFamily: "Lato-Regular"}}>Search By Country</Text></Button>
  </Segment>
        
         

            <View>
<Horizontal />
<View>
<Tags />
</View>
</View>
</View>
          }
          
                keyExtractor={(item, index) => index.toString()}/>

你试过javascript地板法吗?如果您为 ids 分配了一个数字,我认为这将帮助您获得一个随机 JSON。

你可以这样写:

const fetchLastestPost = async () => {
    let page = Math.floor(100)
    const response = await fetch(
        `https://learnersnews.com/wp-json/wp/v2/case?per_page=10&page=${page}`,
    );
    ...
}

或者如果 id 没有排序,那么你可以尝试将 id 放在一个数组中:

const fetchLastestPost = async () => {
        let value = Math.floor(4);
        let page = [1,3,4,7,10]
        const response = await fetch(
            `https://learnersnews.com/wp-json/wp/v2/case?per_page=10&page=${page[value]}`,
        );
        ...
    }

或者,如果您想在不知道 ID 和序列的情况下获取数据,请尝试:

const fetchLastestPost = async () => {
let page = Math.floor(100) //add totalCount in number which you can get from server side.
    const response = await fetch(
        `https://learnersnews.com/wp-json/wp/v2/case?per_page=10&page=${page}`,
    );
    if(response == ""){
        fetchLastestPost();
    }
    ...
}