.net React路由器捕获webapi路由

带有react 16.12.0的.NET Core 3.1 web应用程序

问题

新手在反应。。。当我获取“api/checksheet/types”时，它被“/checksheet/：checkSheetTypeId”捕获，并尝试加载为该路由声明的组件

如何消除前端和服务器端路由之间的冲突

服务器端，2个端点

[Route("api/[controller]")]
[ApiController]
public class CheckSheetController : ControllerBase
{
    // GET: api/checksheet/types
    [HttpGet]
    public IList Types()
    {
    }

    // GET: api/checksheet/{id}
    [HttpGet("{id}")]
    public Dto Get(int id)
    {
    }
}

<Layout>
    <Switch>
        <Route exact path='/checksheet/add' component={AddChecksheet} />
        <Route path='/checksheet/:checkSheetTypeId' component={TasksPage} />
    </Switch>
</Layout>

App.js

[Route("api/[controller]")]
[ApiController]
public class CheckSheetController : ControllerBase
{
    // GET: api/checksheet/types
    [HttpGet]
    public IList Types()
    {
    }

    // GET: api/checksheet/{id}
    [HttpGet("{id}")]
    public Dto Get(int id)
    {
    }
}

<Layout>
    <Switch>
        <Route exact path='/checksheet/add' component={AddChecksheet} />
        <Route path='/checksheet/:checkSheetTypeId' component={TasksPage} />
    </Switch>
</Layout>

---

仔细想想，我可以通过遵循RESTful API命名约定来解决这个问题，这样CheckSheetController就被多元化了，然后进行端点调用/API/checksheets/{id}

尽管必须有另一种解决办法