javascript - 类型错误 : undefined is not an object (evaluating 'data.filter' ) - React Native

标签 javascript reactjs react-native fetch

我是 React/编程新手,在获取/显示数据时遇到问题。我的代码返回以下错误。提前感谢您的帮助。

类型错误:类型错误:未定义不是对象(评估“data.filter”)

  import useFetch from 'react-fetch-hook'

  const { data } = useFetch('http://192.168.2.94:3000/list-categories')

  const locations = props.navigation.getParam('locationId')

  const displayedCategories = data.filter(      // ERROR HERE
    cat => cat.locId.indexOf(locations) >= 0
  )

  const renderGridItem = itemData => {
    return (
      <CategoryGridTile
        image={itemData.item.image}
        title={itemData.item.title}
      />
    )
  }

  return (
    <FlatList
      keyExtractor={(item, index) => item.id}
      data={displayedCategories}
      renderItem={renderGridItem}
    />
  )
}

JSON from http://192.168.2.94:3000/list-categories

最佳答案

useFetch 返回一个 isLoading 标志以及数据,您必须使用这些数据来显示加载指示器,直到数据可用

const { isLoading, data } = useFetch('http://192.168.2.94:3000/list-categories');
 if(isLoading) {
    return <span>Loading...</span>
 }
 const locations = props.navigation.getParam('locationId')

  const displayedCategories = data.filter(
    cat => cat.locId.indexOf(locations) >= 0
  )

  const renderGridItem = itemData => {
    return (
      <CategoryGridTile
        image={itemData.item.image}
        title={itemData.item.title}
      />
    )
  }

  return (
    <FlatList
      keyExtractor={(item, index) => item.id}
      data={displayedCategories}
      renderItem={renderGridItem}
    />
  )

关于javascript - 类型错误 : undefined is not an object (evaluating 'data.filter' ) - React Native,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59243309/

相关文章:

javascript - react-native 可滑动手势在 android 上不起作用?

javascript - POST 请求中的测试和 stub 参数

javascript - 什么时候需要返回嵌套的 Promise?

javascript - Ext js 4.2.1 警告框看起来不太好

javascript - 等待 for 循环结束以继续 JavaScript 中的函数

javascript - If/Else/Switch 返回错误结果

react-native - react native 导航 : Identify if component is modal

Javascript split() 弄乱了我的 html 标签

javascript - Dispatch 不会立即更新组件

android - React Native 陷入配置 React-Native-gesture-handler 的困境