React + django, not being able to render detail view

I'm having some trouble fetching data from my modules when it comes to detail views. Basically I have news that are displayed, and then I want the user to be able to click the news and get to a detail view of that news. The fetching works fine when the url is just localhost/Nyheter (news in swedish) but not when I add an id after (localhost/Nyheter/10). This is the relevant code (I hope). I might be missing something very basic, but I've looked around for a while and it can't make it make sense, thanks in advance!

NewsItemPage.js

class NewsItem extends Component{
state={
    item: {}
}

id = this.props.params.match.id;

async componentDidMount(){

    try {


        const res = await fetch("http://localhost:8000/api/news/"+this.id);
        const item = await res.json();
        console.log(item);

        this.setState({
            item
        })
    }catch(e){
        console.log(e);
    }
}

App.js

    function App() {
  return (
    <Router>
          <Navigation />
          <Routes>
            <Route path="/" element={<Home />}>
              Hem
            </Route>
            <Route path="/Nyheter" element={<News/>}>Nyheter</Route>
            <Route path="/Nyheter/:id" element={<NewsItemPage/>}>Nyheter-detaljer</Route>
            <Route path="/om-oss">Om oss</Route>
            <Route path="/kontakt">Kontakt</Route>
          </Routes>
          <Footer />
    </Router>
  );

serializers.py

class NewsSerializer(serializers.ModelSerializer):

    class Meta:
        model = News
        fields = '__all__'
        lookup_field = 'id'

views.py

@api_view(['GET'])
def news_list(request):
    if request.method == 'GET':
        data = News.objects.all()

        serializer = NewsSerializer(data, context={'request': request}, many=True)

    return Response(serializer.data)

urls.py

from hemsida import views

from jk import settings

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', TemplateView.as_view(template_name='index.html')),
    re_path(r'^api/news/$', views.news_list),
    re_path(r'^api/news/<int:id>$', views.news_list),
]+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

models.py

class News(models.Model):
title = models.TextField(max_length=100)
description = models.TextField()
image = models.ImageField(upload_to="Images/")
created_on = models.DateTimeField(auto_now_add=True)


def __str__(self):
    return self.title

class Meta:
    ordering = ['created_on']

Back to Top