render(<Users />, document.getElementById('admin'));
<Route path="Admin/Users" getComponent={
(location,cb)=>require('./Admin')(location,cb)}></Route>
// Common js modular system with es5 syntax
module.exports = function(location, cb) {
if (typeof require.ensure == 'function') {
/* Asynchronous loading of a component that is inside of require.ensure */
require.ensure([], (require) => {
cb(null, require('./Users'))
})
} else {
/* Server side synchronous loading */
cb(null, require('./Users'));
}
}
import React, { Component } from 'react';
import { Input, Button, Collapse } from 'react-bootstrap';
export class Users extends Component {
constructor(...args) {
super(...args);
this.state = {
all_users:''
};
}
...
}
render() {
return (
<div>
<h1>Admin Panel</h1>
...
</div>
);
}
}
export default Users;
//Так работае
import { Users } from './Admin/Users';
//А так нет
require.ensure([], function(require) { var Users = require('./Admin/Users'); }, 'users');
//Как можно использовать его здесь? ReferenceError: Users is not defined
<Route path="Users" component={Users}></Route>
<Route path="Admin/Users" component={Users}></Route>
import { Users } from './Admin/Users';
//в роутере
<Route path="Users" component={Users}></Route>
//а потом как функцию использую в UserHome.js висит на навигации
<MenuItem onClick={()=>this.changeUsers()}>Manage Users</MenuItem>
{this.props.children}
import React, { Component } from 'react';
import { BarChart } from 'react-d3';
export class first extends Component {
constructor(...args) {
super(...args);
this.state = {};
}
render() {
var data =
[
{
"name": "Series A",
"values": [
{ "x": 1, "y": 91},
{ "x": 2, "y": 44}
]
},
{
"name": "Series B",
"values": [
{ "x": 1, "y": 191},
{ "x": 2, "y": 344}
]
}
];
return (
<div>
<h1>First Chart</h1>
<BarChart
data={data}
width={500}
height={200}
fill={'#3182bd'}
title='Bar Chart'
yAxisLabel='Label'
xAxisLabel='Value'
/>
</div>
);
}
}
export default first;