React-роутер перехватывает маршруты webapi - PullRequest
Новая
       6

React-роутер перехватывает маршруты webapi

0 голосов
/ 17 февраля 2020

. NET Core 3.1 веб-приложение с реакцией 16.12.0.

Проблема

Newb ie при реакции ... когда я получаю api / checkheet / types 'он перехватывается' / checkheet /: 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)
    {
    }
}

Приложение. js

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

Компонент 

import React, { Component } from 'react';

export class NavMenu extends Component {
    constructor(props) {
        super(props);
        this.state = { types: [], loading: true };
    }

    componentDidMount() {
        this.getTypes();
    }

    async getTypes() {
        const response = await fetch('api/checksheet/types');
        const data = await response.json();
        this.setState({ types: data, loading: false });
    }
}

1 Ответ

0 голосов
/ 17 февраля 2020

Если подумать, я могу решить эту проблему, следуя соглашениям об именах API RESTful, так что CheckSheetController является множественным, а затем выполняет мои вызовы конечной точки / api / checkheets / {id}

Хотя должен быть другой решение ....

...