/imports/ui/Landing.js
import React, {Component} from 'react';
class Landing extends Component {
render() {
return (
<div>
Landing
</div>
);
}
}
export default Landing;
/imports/ui/AdminMain.js
import React, {Component} from 'react';
class AdminMain extends Component {
render() {
return (
<div>
AdminMain
</div>
);
}
}
export default AdminMain;
/imports/ui/App.js
import React, {Component} from 'react';
import {withTracker} from 'meteor/react-meteor-data';
import {BrowserRouter as Router,Route,Switch} from 'react-router-dom';
import {Tasks} from '/imports/api/tasks';
import Landing from '/imports/ui/Landing';
import AdminMain from '/imports/ui/AdminMain';
class App extends Component {
render() {
return (
<div>
<Router>
<Switch>
<Route exact path="/" component={Landing}/>
<Route exact path="/admin" component={AdminMain}/>
</Switch>
</Router>
</div>
);
}
}
export default withTracker(props => {
// Do all your reactive data access in this method.
// Note that this subscription will get cleaned up when your component is unmounted
const handles = [
Meteor.subscribe('tasks', props.id),
Meteor.subscribe('allUsers')
];
const loading = handles.some(handle => !handle.ready());
console.log('loading',loading);
return {
currentUser: Meteor.user(),
listLoading: loading,
tasks: Tasks.find({listId: props.id}).fetch(),
};
}
)(App);
http://localhost:3000
http://localhost:3000/admin