守著星空守著你
2023-06-09 15:24:20
我正在嘗試呈現(xiàn)一個(gè)博客頁(yè)面以顯示所有 Storyblok 博客條目:這是我的 blog.js 頁(yè)面import React from "react"import Layout from "../components/layout"import Blogposts from "../components/BlogPosts"import StoryblokService from '../utils/storyblok-service'export default class extends React.Component { state = { stories: { } } async getInitialStories() { let { data: { stories } } = await StoryblokService.get('cdn/stories?starts_with=blog') return stories } async componentDidMount() { let stories = await this.getInitialStories() if(stories.content) this.setState({ stories }) console.log(stories) setTimeout(() => StoryblokService.initEditor(this), 200) } render() { return ( <Layout> <Blogposts stories={this.state.stories.content} /> </Layout> ) }}console.log(stories)返回我的博客文章Blogposts 組件看起來像這樣import React from 'react'const BlogPosts = (stories) => ( <ul> {stories.map((story) => ( <li key={story._uid}> { story.title } </li> ) )} </ul>)export default BlogPosts 但是當(dāng)我運(yùn)行它時(shí),我得到了這個(gè)錯(cuò)誤。TypeError: undefined is not a function (near '...stories.map...') BlogPosts src/components/BlogPosts.js:52 | 3 | const BlogPosts = (stories) => ( 4 |> 5 | <ul> 6 | {stories.map((story) => ( 7 | <li key={story._uid}> 8 | { story.title }任何幫助將不勝感激!謝謝。
2 回答

慕標(biāo)琳琳
TA貢獻(xiàn)1830條經(jīng)驗(yàn) 獲得超9個(gè)贊
您正在傳遞undefined
給Blogposts
,因?yàn)?code>content一開始您的狀態(tài)中不存在,并且您僅在獲取數(shù)據(jù)后才設(shè)置它。

鳳凰求蠱
TA貢獻(xiàn)1825條經(jīng)驗(yàn) 獲得超4個(gè)贊
您在此處傳遞故事<Blogposts stories={this.state.stories.content} />
,但值是通過異步獲取的。所以模板試圖在值可用之前呈現(xiàn)const BlogPosts = (stories) => ()
改為<Blogposts stories={this.state.stories.content} />
_{this.state.stories.content && <Blogposts stories={this.state.stories.content} />}
添加回答
舉報(bào)
0/150
提交
取消