標題: [操作疑難] ReactJS 關於 router & Link to [打印本頁]

---

作者: fredayeung    時間: 2018-5-11 10:31     標題: ReactJS 關於 router & Link to

本帖最後由 fredayeung 於 2018-5-11 10:35 編輯

宜家學梗 ReactJS router, 但當我用 localhost:8080 load 出來時係無問題, 但當我選其中一條 Link to, 個畫面無 load 野, blank 左, 但又無話有 error, 你地有無遇過這問題?

main.js 如下:
import React from 'react';
import {Link} from 'react-router';
export default class Main extends React.Component{
render(){
return (
<div>
<Link to='/javascript'>javascript</Link>
          { ' | ' }
<Link to='/reactjs'>React</Link>
{this.props.children}
</div>
  )
}
}

index.js 如下:
import React from 'react';
import {render} from 'react-dom';
import {Router, Route, browserHistory,IndexRoute} from 'react-router';
import Main from './main';
import javascript from './javascript';
import Angular from './AngularJS';
import JSReact from './reactjs';

class App extends React.Component{

  render(){
return (
<Router history={browserHistory}>
<Route path="/" component={Main}>
<IndexRoute component={javascript} />
<Route path='javascript' Component={javascript} />
<Route path='AngularJS' Component={Angular} />
<Route path='reactjs' Component={JSReact} />
</Route>
</Router>
  )
  }
}
render(<App />,document.getElementById('apps'));

---

作者: tsangwailam    時間: 2018-5-11 11:47

path='javascript' 改做  path='/javascript'

---

作者: fredayeung    時間: 2018-5-11 11:58




試過, 唔得!

---

作者: tsangwailam    時間: 2018-5-11 14:52

你啲寫法係 V3 你係咪LIBRARY用緊V4?

---

作者: fredayeung    時間: 2018-5-11 14:59

本帖最後由 fredayeung 於 2018-5-11 15:09 編輯



我係 reactjs 新手, 點 check library 既 version?
如果指 react-router 我用 version 3.0.0

---

作者: tsangwailam    時間: 2018-5-11 15:47

package.json

---

作者: fredayeung    時間: 2018-5-11 15:57



{
  "name": "react_tut05",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.18.2",
    "babel-loader": "^6.2.7",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "express": "^4.14.0",
    "path": "^0.12.7",
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "react-router": "^3.0.0",
    "webpack": "^1.13.3"
  },
  "devDependencies": {}
}

---

作者: fredayeung    時間: 2018-5-11 17:24

原來下面呢三行用左大草 Component, 應該係細草

<Route path='javascript' Component={javascript} />
<Route path='AngularJS' Component={Angular} />
<Route path='reactjs' Component={JSReact} />