Question

如何解决这个问题？

我是 React Native 的新手，我最近 2 天试图解决这个问题。

TypeError: Cannot read property 's_path' of undefined

This error is located at:
    in List (at SearchScreen.js:119)

我正在尝试从服务器获取图像

我搜索了很多，但无法解决。请帮忙。

SearchPage.js

  useEffect(() => {
    loadItem();
  }, [query, pageCurrent, refreshing]);
  const loadItem = async () => {
    const response = await client.get(
      `api.php?key=test-api-key&type=read&object=search&action=latestItems&limit=${pageCurrent}`
    );
    if (!response.ok) return setError(true);
    setError(false);
    setRefreshing(false);
    dispatch(adDeatailsRequiested());
    dispatch(adsData(response.data.response));
  };

  handleSearch = (text) => {
    setQuery(text);
    dispatch(searchQuery(query1));
  };

  loadMore = () => {
    setpageCurrent(pageCurrent + 10);
  };

  pageRefreshing = () => {
    setRefreshing(true);
  };

  return (
    <View style={styles.container}>
      <ActivityIndicator visible={loading} />
      <View style={styles.listing}>
        <FlatList
          showsVerticalScrollIndicator={false}
          numColumns={!liked ? 1 : 2}
          key={!liked ? "ONE COLUMN" : "TWO COLUMN"}
          style={styles.list}
          data={Data}
          keyExtractor={(item) => item.pk_i_id}
          initialNumToRender={10}
          removeClippedSubviews={true}
          onEndReached={loadMore}
          onEndReachedThreshold={0}
          refreshing={refreshing}
          onRefresh={pageRefreshing}
          renderItem={({ item }) => (
           


LINE 119=>>>>>                   <List
                      title={item.s_title}
                      description={item.s_description}
                      subTitle={"₹" + item.i_price}
                      location={item.s_city}
                      region={item.s_region}
                      date={item.dt_pub_date}
                      adId={item.fk_i_item_id}
                      onPress={() =>
                        navigation.navigate(
                          routes.ITEM_SCREEN,
                          {
                            itemId: item.fk_i_item_id,
                            title: item.s_title,
                            description: item.s_description,
                            price: item.i_price,
                            date: item.dt_pub_date,
                            region: item.s_region,
                            city: item.s_city,
                            userName: item.s_contact_name,
                            userId: item.fk_i_user_id,
                          }
                        )
                      }
                    />
                  )}
                </>
              )}
            />
          </View>
        </View>
      );
    }

list.js

useEffect(() => {
  loadImage();
}, []);

const loadImage = async () => {
  const response = await itemApi.getImage(+adId);
  if (!response.ok) return setError(true);
  setError(false);
  setImage(response.data.response);
};
return (
  <TouchableWithoutFeedback onPress={onPress}>
    <View style={styles.container}>
      <View style={styles.imageContainer}>
        <Image
          style={styles.image}
          source={
            image
              ? {
                  uri: `${baseURL}${image[0].s_path}${image[0].pk_i_id}.${image[0].s_extension}`,
                }
              : defaultImg
          }
        />
      </View>
    </View>
  </TouchableWithoutFeedback>
);

Answer 1

请添加条件以检查 image[0] 不是 null 或 undefined

{image[0] &&
<Image
          style={styles.image}
          source={
            image
              ? {
                  uri: `${baseURL}${image[0].s_path}${image[0].pk_i_id}.${image[0].s_extension}`,
                }
              : defaultImg
          }
        />}

类型错误：无法读取未定义的属性“s_path”（React Native）

1 个答案: