在获取查询中传递 id 参数 (ReactJS)

Question

我是 javscript 开发的新手，在查询中传递 id 参数时遇到了一些问题 URL。我现在在主体中传递 ID 值，这是不正确的，我想在 REST 方法中。

如何像 https://localhost:5001/api/departments/{id} 一样将 Id: event.target.DepartmentId.value, 传递给 URL？

handleSubmit(event){
    event.preventDefault();
    fetch("https://localhost:5001/api/departments/", {
        method: "PUT",
        headers:{
            "Accept":"application/json",
            "Content-Type":"application/json",
            "Origin": "*"
        },
        body: JSON.stringify({
            Id: event.target.DepartmentId.value,
            Name: event.target.DepartmentName.value
        })
    })
    .then(res=>res.json())
    .then((result)=>
    {
        this.setState({snackbaropen: true, snackbarmsg: "Edited successfully!"})
        
    },
    (error) =>{
        this.setState({snackbaropen: true, snackbarmsg: "failed"})
    }
    )
}

感谢您的帮助！

Answer 1

你可以像这样使用 js 模板文字：

handleSubmit(event){
    event.preventDefault();
    fetch(`https://localhost:5001/api/departments/${event.target.DepartmentId.value}`, {
        method: "PUT",
        headers:{
            "Accept":"application/json",
            "Content-Type":"application/json",
            "Origin": "*"
        },
        body: JSON.stringify({
            Id: event.target.DepartmentId.value,
            Name: event.target.DepartmentName.value
        })
    })
    .then(res=>res.json())
    .then((result)=>
    {
        this.setState({snackbaropen: true, snackbarmsg: "Edited successfully!"})
        
    },
    (error) =>{
        this.setState({snackbaropen: true, snackbarmsg: "failed"})
    }
    )
}

Answer 2

你应该使用参数

并在服务器端查询参数

   `https://localhost:5001/api/departments/?id=${id}`

Answer 3

这成功了。而文字没有。

  localhost:5001/api/departments" + event.target.DepartmentId.value

在获取查询中传递 id 参数 (ReactJS)

Pass id parameter in fetch query (ReactJS)

javascript

reactjs

fetch-api