Question

我是使用React的新手，目前正在学校做一个项目。我的问题是我已经设置了一个api js文件，该文件连接到mongodb数据库，并且我也有一个到集合的路由。然后在ReactContext中，我尝试获取集合，并且可以正常工作。我的问题是，当我尝试从MovieList组件呈现它时，我得到“无法读取未定义的属性'map'”，控制台已登录json，并获得了集合的文档，但是以某种方式，当ReactContext返回它时，它就变得不确定？

代码：

      //  let response = await fetch('/api/movies/')
      //  response = await response.json()
      //  return response
      var response = await fetch('/api/movies/')
      var data = await response.json()
      console.log(data)
      return data
    }

    const test = () => {
        let data = getMovies()
        console.log(data)
    }

    const [movies2, setMovies2] = useState(getMovies)

    return (
        <MovieContext.Provider value={{movies2}}>
            {props.children}
        </MovieContext.Provider>
    ) ```
Can someone see what the problem is?
When I used a dummy data in a const variable with the data it works.

This is the code which calls "map()".
```const list = () => {
        return movies.map((movie, i) => {
            return (
                <Card
                    key={movie.title + i}
                    body
                    inverse
                    className="mb-2"
                    style={{
                        backgroundColor: '#330000',
                        borderColor: '#FF0000'
                    }}
                >
                <Container>
                    <Row>
                        <img style={{
                            height: '100px'
                        }}  
                        src={movie.image} 
                        alt="movie"></img>
                        <Col>
                            <CardTitle>Titel: <br></br>{ movie.title }</CardTitle>
                            <CardText>Om: <br></br>{ movie.about }</CardText>
                            <CardText>Åldersgräns: <br></br>{ movie.age_limit }</CardText>
                            <CardText>Längd: <br></br>{ movie.length }</CardText>
                            <CardText>Pris: <br></br>{ movie.ticket_price }</CardText>
                            <div>
                                <ModalVideo channel='youtube' isOpen={isOpen} videoId={movie.movieTrailer} onClose={toggleIsOpen} />
                                <Button onClick={toggleIsOpen}>Spela Trailer</Button>
                            </div>
                        </Col>
                    </Row>
                </Container>
                </Card>
            )
        })
    }```

无法使用mongoose通过从mongodb导入的json数组进行映射

0 个答案: