javascript - 组件无法访问上下文

Question

我是新来的，如果我问了一个愚蠢的问题，请原谅我。 这个想法是从上下文访问 tweets 数组，找到匹配的 tweet，然后将其设置在组件的状态中以访问数据。

但是，推文数组结果为空，即使我确定它填充了推文

   const { tweets } = useContext(TweeetterContext)
   const [tweet, setTweet] = useState({})

   useEffect(() => {
      loadData(match.params.id, tweets)
   }, [])

   const loadData = (id, tweets) => {
      return tweets.filter(tweet => tweet.id == id)
   }
   return (stuff)
   }

Answer 1

您正在完全正常地访问上下文，如果您可以共享设置推文的代码，那就太好了。

与此无关，我在这里可能发现的潜在问题与 useEffect 函数有关。您正在使用来自外部上下文的变量(match.params.id 和 tweets)，但您没有将它们设置为依赖项。因此，您的 useEffect 将仅在组件初始创建时运行一次。 实际问题可能是 tweets 是在初始创建之后设置的(为 tweets 设置正确的值有一些延迟，例如因为网络请求)。

尝试像这样使用它，看看是否可以解决问题:

useEffect(() => {
   loadData(match.params.id, tweets)
}, [match.params.id, tweets])

此外，不确定您的 useEffect 实际在做什么，因为它没有将结果分配到任何地方，但我假设它只是为了代码片段清晰而被删除。