使用 Axios 和 VueJS 通过 id 获取数据

Question

我的服务器端有这个 get 函数，我想通过将 ID 作为参数来获取数据库中的特定条目。在我的 VueJS 应用程序中，我编写了一个 Axios get-call，但它没有给我任何数据。它只说

“无法获取...”。

我知道我为函数提供的 ID 是正确的，所以这不是问题。

客户端：

loadData() {
     axios.get('http://localhost:8080/route', {
        params: {
            id: this.selectedRoute
        }
     })
     .then(response => (this.chosenRoute = response.data));
}

服务器端：

app.get('/route/:id', function(req, res) {
    const routeId = req.params.id;
    Route.findById(routeId, (err, route) => {
        res.set("Access-Control-Allow-Origin", "*");
        res.json(route);
    });
});
    enter code here

Answer 1

通过将id（即this.selectedRoute）连接到url 来尝试类似的操作：

  loadData() {
     axios.get('http://localhost:8080/route/'+ this.selectedRoute)
              .then(response => (this.chosenRoute = response.data));
}

在你的最后一个问题中，你有这个：

      <select name="routeSelect" v-model="selectedRoute">
          <option v-for="routes in result" v-bind:key="routes.name" v- 
           bind:value="routes.name"> {{ routes.name }} </option>
      </select>

这不起作用，因为 selectedRoute 是路线 name 不是 id 来解决你必须这样做：

          <option v-for="routes in result" v-bind:key="routes.name" v- 
           bind:value="routes.id" >...

通过将选择选项 value 绑定到 路由 id