0

我正在尝试访问/wp-json/wp/v2/media/ wordpress API 并从guid.rendered获取图像的 uri并将其设置为 FlatList 内的 Image 但出现以下错误

您试图在一个本来是不可变的对象上设置键 _v 值为 1 并且被冻结。

主页.js

return(
  <SafeAreaView style={styles.container}> 
    <View>
           {isLoading ? <ActivityIndicator /> : (
     <FlatList 
     onRefresh={onRefresh}
     refreshing={isFetching}
      data={post}
      keyExtractor={({ id },index) => id}
      renderItem={({ item }) => (
        <TouchableOpacity onPress={() => Alert.alert('Blog reader feature will be available soon!')}>
          <View style={{padding:5,backgroundColor:'#3578e5',margin:5}}>
            <Image style={{width:Dimensions.width,height:250}} source={{
              uri: getBlogPostsImage(item.featured_media)
            }}/>
          <Text style={{fontWeight:'bold',color:'#fff',fontSize:20,marginTop:5}}>{item.title.rendered}</Text>
          <Text style={{color:'#fff',marginTop:5}}>{item.date}</Text>
          <RenderHtml source={getContent(item)} tagsStyles={tagsStyles} />
          </View>
        </TouchableOpacity>
      )
    }
    />
  )}
  </View>
  </SafeAreaView>   
);

getBlogPostsImage()

const getBlogPostsImage = async (id) => {
  try {
   const response = await fetch('http://wp.devlops.xyz/wp-json/wp/v2/media/'+id);
   const jsonPostImage = await response.json();
   return jsonPostImage.guid.rendered;
 } catch (error) {
   Alert.alert("Failed to load image");
 }

}

如果特色图像存在，我也尝试获取，但这也不起作用

{item.featured_media>0 ? <Image style={{width:Dimensions.width,height:250}} source={{
              uri: getBlogPostsImage(item.featured_media)
            }}/>:null}

更新

使用此处提供的解决方案，URI 现在出现在/wp-json/wp/v2/posts/id中，但不会被获取！

更新的平面列表

<FlatList 
     onRefresh={onRefresh}
     refreshing={isFetching}
      data={post}
      keyExtractor={({ id },index) => id}
      renderItem={({ item }) => (
        <TouchableOpacity>
          <View style={{padding:5,backgroundColor:'#3578e5',margin:5}}>
            {item.featured_media>0?<Image style={{width:Dimensions.width,height:250}} source={{
              uri: item.featured_media_uri
            }}/>:null}
          <Text style={{fontWeight:'bold',color:'#fff',fontSize:20,marginTop:5}}>{item.title.rendered}</Text>
          <Text style={{color:'#fff',marginTop:10}}>{item.date}</Text>
          <RenderHtml source={getContent(item)} tagsStyles={tagsStyles} />
          </View>
         
        </TouchableOpacity>
        
      )
    }
    />
4

0 回答 0