Commit fa6f2d72 authored by jnsone11's avatar jnsone11
Browse files

wip

parent 06d2761f
......@@ -2832,6 +2832,18 @@
"minimalistic-assert": "1.0.0"
}
},
"history": {
"version": "4.7.2",
"resolved": "https://registry.npmjs.org/history/-/history-4.7.2.tgz",
"integrity": "sha512-1zkBRWW6XweO0NBcjiphtVJVsIQ+SXF29z9DVkceeaSLVMFXHool+fdCZD4spDCfZJCILPILc3bm7Bc+HRi0nA==",
"requires": {
"invariant": "2.2.2",
"loose-envify": "1.3.1",
"resolve-pathname": "2.2.0",
"value-equal": "0.4.0",
"warning": "3.0.0"
}
},
"hmac-drbg": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
......@@ -2843,6 +2855,11 @@
"minimalistic-crypto-utils": "1.0.1"
}
},
"hoist-non-react-statics": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.3.1.tgz",
"integrity": "sha1-ND24TGAYxlB3iJgkATWhQg7iLOA="
},
"hosted-git-info": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.5.0.tgz",
......@@ -2934,6 +2951,14 @@
"integrity": "sha1-ftGxQQxqDg94z5XTuEQMY/eLhhQ=",
"dev": true
},
"invariant": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
"integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A=",
"requires": {
"loose-envify": "1.3.1"
}
},
"invert-kv": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
......@@ -4280,6 +4305,48 @@
"lodash": "4.17.4"
}
},
"react-router": {
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-4.2.0.tgz",
"integrity": "sha512-DY6pjwRhdARE4TDw7XjxjZsbx9lKmIcyZoZ+SDO7SBJ1KUeWNxT22Kara2AC7u6/c2SYEHlEDLnzBCcNhLE8Vg==",
"requires": {
"history": "4.7.2",
"hoist-non-react-statics": "2.3.1",
"invariant": "2.2.2",
"loose-envify": "1.3.1",
"path-to-regexp": "1.7.0",
"prop-types": "15.6.0",
"warning": "3.0.0"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"path-to-regexp": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
"integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
"requires": {
"isarray": "0.0.1"
}
}
}
},
"react-router-dom": {
"version": "4.2.2",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-4.2.2.tgz",
"integrity": "sha512-cHMFC1ZoLDfEaMFoKTjN7fry/oczMgRt5BKfMAkTu5zEuJvUiPp1J8d0eXSVTnBh6pxlbdqDhozunOOLtmKfPA==",
"requires": {
"history": "4.7.2",
"invariant": "2.2.2",
"loose-envify": "1.3.1",
"prop-types": "15.6.0",
"react-router": "4.2.0",
"warning": "3.0.0"
}
},
"read-pkg": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
......@@ -4388,6 +4455,11 @@
"integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
"dev": true
},
"resolve-pathname": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-2.2.0.tgz",
"integrity": "sha512-bAFz9ld18RzJfddgrO2e/0S2O81710++chRMUxHjXOYKF6jTAMrUNZrEZ1PvV0zlhfjidm08iRPdTLPno1FuRg=="
},
"resolve-url": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
......@@ -5505,6 +5577,11 @@
"spdx-expression-parse": "1.0.4"
}
},
"value-equal": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/value-equal/-/value-equal-0.4.0.tgz",
"integrity": "sha512-x+cYdNnaA3CxvMaTX0INdTCN8m8aF2uY9BvEqmxuYp8bL09cs/kWVQPVGcA35fMktdOsP69IgU7wFj/61dJHEw=="
},
"vary": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
......@@ -5519,6 +5596,14 @@
"indexof": "0.0.1"
}
},
"warning": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
"integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
"requires": {
"loose-envify": "1.3.1"
}
},
"watchpack": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
......
......@@ -14,6 +14,7 @@
"express": "^4.16.2",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router-dom": "^4.2.2",
"typescript": "^2.7.1"
},
"devDependencies": {
......
import * as React from 'react'
import {hydrate} from 'react-dom'
import Hello from './components/Hello'
import RootRoutes from './components/RootRoutes'
const reactRoot = document.getElementById('react-root');
......@@ -11,7 +11,7 @@ const render = (Routings: React.ComponentClass) => {
)
};
hydrate(render(Hello),reactRoot);
hydrate(render(RootRoutes),reactRoot);
declare let module: {
hot: {
......@@ -19,8 +19,8 @@ declare let module: {
}
}
module.hot.accept('./components/Hello', () => {
import('./components/Hello').then((module: any) => {
module.hot.accept('./components/RootRoutes', () => {
import('./components/RootRoutes').then((module: any) => {
hydrate(render(module.default), reactRoot);
})
})
\ No newline at end of file
import * as React from 'react'
import {Component} from 'react'
import {RouteComponentProps} from 'react-router-dom'
interface Props {
}
class ComponentWithId extends Component<RouteComponentProps<Props>> {
render(){
console.log('withProps',this.props);
return <div>Hello</div>
}
}
export default ComponentWithId;
import * as React from 'react'
import {Component} from 'react'
class FunComponent extends Component {
render(){
return <div>Routing is Fun</div>
}
}
export default FunComponent;
......@@ -3,7 +3,7 @@ import {Component} from 'react'
class HelloComponent extends Component {
render(){
return <div>Hello!!</div>
return <div>Hello</div>
}
}
......
import * as React from 'react'
import {Component} from 'react'
import {BrowserRouter, Route, Link} from 'react-router-dom'
import HelloComponent from './Hello'
import FunComponent from './Fun'
import ComponentWithId from './ComponentWithId'
class RootRoutes extends Component {
render() {
return <div>
<BrowserRouter>
<div>
<Link to="/">Go to Main</Link>
<br/><br/>
<Link to="/fun">Go to fun</Link>
<br/><br/>
<Link to="/withState">Go to withState</Link>
<br/><br/>
<Route exact path="/" component={HelloComponent}/>
<Route exact path="/fun" component={FunComponent}/>
<Route exact path="/withState" component={ComponentWithId}/>
<Route exact path="/withState/:id" component={ComponentWithId}/>
</div>
</BrowserRouter>
</div>
}
}
export default RootRoutes;
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment