Javascript 用axios表达承诺

我会首先说，我不知道这是否是问题所在，但很可能是（希望如此）

我正在使用axios将数据发布到API

数据发布成功，但从未到达.then函数。即：

  createPage(page) {
    instance.post('/admin/createPage',page).then((response) => {
      console.log(response) <------- Never gets to.
    }).catch((error) => {
      console.log(error)
    })
  }

app.js：

import React, { Component } from 'react';
import {
  BrowserRouter as Router,
  Route
} from 'react-router-dom'
import axios from 'axios'

import Header from '../components/Header'

import Dashboard from './Dashboard'
import AddEditPage from './AddEditPage'

const instance = axios.create({baseURL: 'http://localhost:1337'})



class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      "pages": []
    }
    this.createPage = this.createPage.bind(this)
    this.getPages = this.getPages.bind(this)
  }

  componentDidMount() {
    this.getPages()
  }

  getPages() {
    instance.get('/admin/listPages')
      .then(
        (response) => {
          this.setState(
            {
              "pages": response.data
            }
          )
        })
      .catch((error) => {console.log(error)})
  }

  createPage(page) {
    instance.post('/admin/createPage',page).then((response) => {
      console.log(response)
    }).catch((error) => {
      console.log(error)
    })
  }

  render() {
    return (
      <Router>
        <div className="Router">
          <div className="Navbar">
            <Header />
          </div>
          <div className="Wrapper">
            <Route exact path="/" render={ () => (
              <Dashboard pages={this.state.pages} />
            )} />
            <Route path="/admin/new-page" render={ () => (
              <AddEditPage createPage={this.createPage} />
            )} />
            <Route path="/admin/edit-page/:id" render={ () => (
              <AddEditPage />
            )} />
          </div>
        </div>
      </Router>

    );
  }
}

export default App;

import React，{Component}来自'React'；
进口{
BrowserRouter作为路由器，
路线
}从“反应路由器dom”
从“axios”导入axios
从“../components/Header”导入标题
从“./Dashboard”导入仪表板
从“./AddEditPage”导入AddEditPage
const instance=axios.create（{baseURL:'http://localhost:1337'})
类应用程序扩展组件{
建造师（道具）{
超级（道具）；
此.state={
“页数”：[]
}
this.createPage=this.createPage.bind（this）
this.getPages=this.getPages.bind（this）
}
componentDidMount（）{
这个文件名为
}
getPages（）{
get（“/admin/listPages”）
.那么(
（回应）=>{
这是我的国家(
{
“页面”：response.data
}
)
})
.catch（（错误）=>{console.log（错误）}）
}
createPage（第页）{
post（'/admin/createPage'，page）。然后（（响应）=>{
console.log（响应）
}).catch（（错误）=>{
console.log（错误）
})
}
render（）{
返回(
(
)} />
(
)} />
(
)} />
);
}
}
导出默认应用程序；

您没有包含您的

/routes/index.js

，因此我们不知道您的实际路由以及它们使用的请求处理程序，因此我们只能对此进行推测，但您描述的是当您不从请求处理程序返回响应时发生的症状

例如，如果您有以下内容：

router.post('/createPage', (req, res) => {
  console.log(req.body);
});

然后您的请求将永远挂起（直到超时）

如果您返回响应：

router.post('/createPage', (req, res) => {
  console.log(req.body);
  res.json({ ok: true });
});

然后请求应该结束并返回success

---

但是当然，您没有包含足够的代码来确定这一点。

您没有包含您的

/routes/index.js

，因此我们不知道您的实际路由以及它们使用什么请求处理程序，因此我们只能对此进行推测，但您描述的是当您不从请求处理程序返回响应时发生的症状

例如，如果您有以下内容：

router.post('/createPage', (req, res) => {
  console.log(req.body);
});

然后您的请求将永远挂起（直到超时）

如果您返回响应：

router.post('/createPage', (req, res) => {
  console.log(req.body);
  res.json({ ok: true });
});

然后请求应该结束并返回success

当然，您没有包含足够的代码来确定这一点