Как сохранить данные API в MongoDB? - PullRequest
Новая
       18

Как сохранить данные API в MongoDB?

0 голосов
/ 23 октября 2018

Это мой реагирующий код, который показывает все данные из API.Карта отображает все данные массива из API. 

export default class Home extends Component{
      constructor() {
        super();
        this.state = {
        users:[],
        };
      }

 componentDidMount() {
   axios
   .get("http://localhost:5000/getNews1") 
   .then(response =>{
     this.setState({users:response.data.articles});
    })
 }

 handleSubmit(){}

     render(){
       const news = this.state.users.map((item, i) =>{
         return(
           <Col sm="4">
             <div key={i}>
               <Card id="size">
                 <CardImg top width="100%" src={item.urlToImage} alt={item.title} />
                <CardBody>
                  <CardTitle>{item.title}</CardTitle>
                  <CardSubtitle id="subtitle">{item.description}</CardSubtitle>
                  <CardText>{item.content}</CardText>
                  </CardBody>
                  <CardFooter>
                  <Button id="save_btn" onClick ={this.handleSubmit}>Save</Button>
                  <Button id="read-btn" href={item.url} target="_blank">Read More</Button>
                  </CardFooter>
                </Card>
                <br/>
               </div>
           </Col>
        )
       })   
      return(
       <div>
         <Container>
          <Row>
           {news}
          </Row>
         </Container>
        </div>
       )         
     }
   }

Вопрос 1. Как получить текущие данные карты, нажав кнопку сохранения.2. После получения данных текущей карты, как отправить их на бэкэнд-сервер

1 Ответ

0 голосов
/ 23 октября 2018

Вы не можете получить доступ к mongodb напрямую с клиента.Ваш handleSubmit должен отправить запрос POST к какой-либо конечной точке, которую вы должны определить / внедрить на своем сервере.В этом обработчике вы можете записать данные (JSON? / Данные формы?) В mongodb.

Супер упрощенный код:

// server.js // assuming express server app.post('/user', async (req, res) => { const payload = req.body await writeToDb(payload) return res.status(200) })

// client component handleSubmit = async () => { await fetch('/user', { method: 'POST' data: // something from this.state }) }

...