我目前处于开发模式,所以我不断刷新页面。我对我的应用程序进行了更改,即每次刷新页面时我的浏览器都会重定向到默认网页。显然,这非常烦人。在下面的示例中,如果我刷新/candidate
,则会重定向到isPublic.jsx
。
我一直想弄清楚我已经改变了什么,但我似乎无法将其缩小。有什么建议。我正在使用: Meteorjs 应对 React-Router V4
路径:import React from 'react';
import PropTypes from 'prop-types'; // ES6
import { Route, Redirect } from 'react-router-dom';
const IsPublic = ({ loggingIn, isCandidate, component: Component, ...rest }) => (
<Route
{...rest}
render={(props) => {
if (isCandidate) {
return (!isCandidate) ?
(<Component loggingIn={loggingIn} isCandidate={isCandidate} {...rest} />) :
(<Redirect to="/candidate" />);
}
if (!isCandidate) {
return (<Component loggingIn={loggingIn} isAdmin={isAdmin} isCandidate={isCandidate} isEmployer={isEmployer} isEmployerButAccountNotActive={isEmployerButAccountNotActive} {...rest} />)
}
}}
/>
);
App.jsx
路径:import { Meteor } from 'meteor/meteor';
import React from 'react';
import PropTypes from 'prop-types'; // ES6
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
import { withTracker } from 'meteor/react-meteor-data';
const App = appProps => (
<Router>
<ScrollToTop>
<div>
<div className="container">
<NavBar {...appProps} />
<div className="container margin-bottom-container">
<Switch>
{/* candidate routes */}
<IsCandidate exact path="/candidate" component={CandidateProfileContainer} {...appProps} />
<IsCandidate exact path="/candidate/all_jobs" component={AllJobsContainer} {...appProps} />
{/* IsPublic routes */}
<IsPublic exact path="/login" component={Login} {...appProps} />
</Switch>
</div>
</div>
</div>
</ScrollToTop>
</Router>
);
App.propTypes = {
loggingIn: PropTypes.bool,
isCandidate: PropTypes.bool
};
export default withTracker(() => {
const loggingIn = Meteor.loggingIn();
const user = Meteor.user();
let candidateHasCompletedRegistrationProcess;
let loadingProfileAccount;
if (!!Roles.userIsInRole(Meteor.userId(), 'isCandidate')) {
const profileAccountHandle = Meteor.subscribe('profileCandidate.candidateUserData');
loadingProfileAccount = !profileAccountHandle.ready();
const candidateCompletedRegistrationProcess = user.candidateCompletedRegistrationProcess;
if (candidateCompletedRegistrationProcess === true) {
candidateHasCompletedRegistrationProcess = !loggingIn && !!Meteor.userId() && !!Roles.userIsInRole(Meteor.userId(), 'isCandidate');
}
}
return {
loggingIn,
loadingProfileAccount,
isCandidate: !!candidateHasCompletedRegistrationProcess
};
})(App);
render() {
const style = {
margin: '0.5em',
paddingLeft: 0,
listStyle: 'none'
};
return <ul style={style}>item</ul>;
}