AXIOS-通过快递发送对象答案

【问题标题】：AXIOS-send object by on expressAXIOS-通过快递发送对象
【发布时间】：2020-12-08 16:54:25
【问题描述】：

//reducer.js
const initialState = {
    students:[]
}
const reducer = (state = initialState, action) =>{
    
    //load... data
    const allStudents = [...state.students];
   
    //check... case
    switch (action.type) {
       case 'GET_STUDENT_LISTS':
            const loadStudent = {
                ...state,
                students: action.payload
            }
            return loadStudent
       default:
            break;
    }
    //end switch case
    return state;
}
export default reducer;

我的项目有一些问题。我想将 app.js 中的 student[] 发送到 reducer.js 中的 student[]。我通过 node app.js 和 localhost:3000/api/students 测试。它可以显示数组。但是 reducer.js 中的 student[] 没有得到它。我怎么能得到它。请帮帮我。

【问题讨论】：

我投票结束这个问题，因为这个问题没有得到最好的解释，详细信息被添加为答案。
抱歉，这是我第一次使用这个。
请添加更多信息。

标签： reactjs express axios

【解决方案1】：

import React, { Component } from 'react';
import Student from './Student';
import {connect} from 'react-redux';
import * as action from '../Action/action';

class StudentList extends Component{
    componentDidMount (){
        this.props.getAllStudents();
    }
   
    render(){
        const AllStudents = this.props.studentsFromStore;
        console.log(AllStudents);
        let list = (
            <div className="col-12 mx-auto">
                <div className="alert-info text-center pt-5 pb-5">not found</div>
            </div>
        );
       
        if(AllStudents.length !== 0){
            list = AllStudents.map(items => (
                <div className="col-12 col-sm-6 col-lg-4 mt-3" key={items.id}>
                    <Student data={items}/>
                </div>
            ));
        }
        return(
            <div className="row">
               {list}
            </div>
        )
    }
}
const mapStateToProps = state => {
    return{
        studentsFromStore : state.students
    }
}
const mapDispatchToProps = dispatch => {
    return {
        getAllStudents : ()=>{
            return dispatch(action.getStudentLists());
        }
    }
}
export default connect(mapStateToProps, mapDispatchToProps)(StudentList);

【讨论】：

【解决方案2】：

//app.js
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
const uuid = require('uuid');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

app.use((req,res,next) =>{
    res.setHeader("Access-Control-Allow-Origin","*");
    res.setHeader("Access-Control-Allow-Origin",
    "Origin","X-Requested_With","Content-Type","Accept","Authorization");
    res.setHeader("Access-Control-Methods","GET,POST,PUT,DELETE");
    next();
  });
  
  app.use(express.json());

  let students =[
      {'id':'1', 'name':'JeepWart', 'score': '99'},
        {'id':'2', 'name':'submition', 'score': '77'},
    ];

  app.get('/api/students', function(req,res) {   
    if (students.length > 0){
        res.send(students);
       
    }else{
     res.status(400).send("not found1");
        }
    });
   
  

const port =process.env.port || 3000;
app.listen(port, function(){
    console.log('listening on port', port);
});

【讨论】：