如何执行axios通过URL中的路由参数获取请求？

Question

所以，我有一个动作创建者，我想从我的API端点获取数据。

以下工作：

export function getData(){ 
    return function(dispatch){ 
     axios.get('/api/form/myuser/mytitle').then((res) => { 
      console.log(res.data); 
      return dispatch(retrieve(res.data)) 
     }) 
     .catch((err) => { 
      console.log(err) 
     }) 
    } 
} 

在我的情况，但是，该API端点的变化。 我首先做一个服务器请求这个网址：/api/form/:userId/:title 那么，其实我想要做的就是上述行动的创建者与爱可信的GET请求作为对我的客户端如下：这里显然

axios.get('/api/form/:userId/:title') 

控制台登录不返回标题字符串，它返回:title

是否有可能做我想做的事情？如果没有，任何建议如何？

Answer 1

好吧，我找到了答案:)

解决方案在于react-router。在此之前我对反应路由器不够熟悉。

关键是在你的路线路径定义参数，可以无论它是（你的店，或者你定义的所有路由文件），内容如下：

<Route path = "form/:userId/:formtitle" component = {Form} /> 

然后，您可以访问这些PARAMS像这样通过道具您的表单组件：

this.props.params.userId 
this.props.params.formtitle 

为了有可用上面的道具到你的动作的创造者，你可以把它们作为你在你的组件触发行动的创建者的参数如下：

this.props.getData (this.props.params.userId, this.props.params.formtitle) 

更多细节在这里：https://github.com/reactjs/react-router-tutorial/tree/master/lessons/08-index-routes

Answer 2

我觉得模板字符串可以为你的问题的一个舒适的解决方案。请不要犹豫，使用Alt Gr + 7！ :)

axios.get(`/api/form/${userId}/${title}`) 

小心使用未定义的值。

https://developer.mozilla.org/hu/docs/Web/JavaScript/Reference/Template_literals