Question

import React, {Component} from 'react';
import axios from 'axios';

export default class CreateDog extends Component {
    constructor(props){
        super(props)

        this.state = {

            name: '',
            activityLevel: '',
            description: ''
        }
        this.newDog = this.newDog.bind(this)
    }

newDog() {

    var doggy = {
        name: this.state.name,
        activityLevel: this.state.activityLevel,
        description: this.state.description
    }

     axios.post('http://localhost:3002/api/createdog', doggy)
        .then(response => {
            console.log("sent successfully")
        })
    }

render(){
    return(
        <div>
            <div>
                <textarea type="text" placeholder="dog breed name" onChange={(e) => this.setState({name: e.target.value})}> </textarea>
                <textarea type="text" placeholder="dog breed activity level" onChange={(e) => this.setState({activityLevel: e.target.value})}> </textarea>
                <textarea type="text" placeholder="dog breed description" onChange={(e) => this.setState({description: e.target.value})}></textarea>
            </div>

            <div>
                <button onClick={() => this.newDog()}></button>
            </div>
        </div>
    )

}

我在newDog函数中有一个axios post请求。

这是我的节点中的端点，带有大量连接字符串。

massive(config.dblink).then(db => {
    app.set('db', db)
})
app.post('/api/createdog', dc.createDog);

控制器：

module.exports = {
createDog: (req, res) => {
    const {name, activityLevel, description} = req.body;

    req.app.get('db').create_dog([name, activityLevel, description])
        .then(dog => {
            console.log(dog)
            res.status(200).send(dog);
        }).catch(err => {
              res.status(500).send(err)})
    }
}

SQL查询

INSERT INTO dogBreed (name, activity_level, description)
VALUES
('English Bulldog', 'super lazy', 'English bulldogs are super lazy but 
adorable')
returning *;

我已经看了好几天了，它似乎与我想要遵循的所有例子相符。请帮忙。对不起代码重载。

以下是我遇到的错误：

POST http://localhost:3002/api/createdog 404 (Not Found)

Answer 1

我相信该错误是因为您在此次通话中使用的是完整网址：

axios.post('http://localhost:3002/api/createdog', doggy)

请尝试使用相对路径：

axios.post('/api/createdog', doggy)

如果这样做不起作用，请不要忘记在/api前添加项目名称：

axios.post('/projectName/api/createdog', doggy)

这为我解决了。

Answer 2

我遇到了类似的问题，调试后，通过提交表单时添加e.preventDefault()来解决此问题：

handleSubmit = (e) => {

         e.preventDefault()
...

}

Answer 3

我错误地使用了轴控器

axios.get({ url:'' , method:''}).then

同时，如果参数作为对象传递，则使用.get（）语法不正确。变成了

axios({url:'your url' , method:'post'}

我不明白为什么我的axios post请求不起作用 - 404找不到

3 个答案: