0
루트 경로가 슬러그로 사용되는 사이트가 있습니다. 불행히도 나는 슬러그 경로를 열기 위해 반응 라우터를 얻을 수 없다. TestList의 경로는 완벽하게 작동합니다. 하지만 그것은 TestItem으로 깨져서 Chrome에서 디버깅 할 수 없습니다.반응 라우터에서 루트 경로의 슬러그 문제
하는 index.js
import { render } from "react-dom";
import React from "react";
import ConditionList from "./src/app/TestList";
import ConditionItem from "./src/app/TestItem";
import { browserHistory, Router, Route } from 'react-router'
const containerEl = document.getElementById("container");
render(
<Router history={browserHistory}>
<Route path="/" component={TestList}>
<Route path="/:slug" component={TestItem}/>
</Route>
</Router>,
containerEl
);
TestList.js
import React, { Component } from "react"
import fetchJsonp from "fetch-jsonp"
import { Link } from 'react-router'
export default class TestList extends Component {
constructor(props) {
super(props);
this.state = { data: [] };
}
componentDidMount() {
fetch('http://localhst:8000/api/v1/testentity/', {
method: 'GET',
mode: 'cors'
})
.then(response => response.json())
.then(data => this.setState({ data: data }))
.catch(err => console.error(this.props.url, err.toString()))
}
render() {
return (
<ul>
{this.state.data.map(function(test, i){
return <li key={i}><Link to={`/${test.slug}`} id={test.id}>{test.name}</Link></li>
})}
</ul>
);
}
}