Question

用户登录或注册后，浏览器历史记录会将用户推送到“/ inventory”浏览器中的网址确实会更改为库存路径，但其自身不会呈现的页面也会被卡住注册页面。如果我使用'/ inventory'网址刷新页面，我会收到“无法获取/清单”的消息。任何想法为什么browserHistory无法正常工作。是的，我确实将它作为参数包含在路由器中。你可以看看我把路线推到底部的actions / index.js中的库存。

index.js

const express = require('express');
const http = require('http');
const bodyParser = require('body-parser');
const morgan = require('morgan');
const app = express();
const router = require('./router');
const mongoose = require('mongoose');
const config = require('./config.js');

// DB Setup for mlab

mongoose.connect(config.database, function(err) {
    if (err) {
        console.log(err);
    } else {
        console.log("Connected to the database");
    }
});

// Connects to local database

// mongoose.connect('mongodb://localhost:auth/auth');

// App Setup

app.use(morgan('combined')); //logs incoming requests

app.use(bodyParser.json({ type: '*/*' })); //parses incoming requests into JSON, '*/*' accepts any type of request

app.use(express.static(__dirname + '/public')); //serves public folder containing front-end

app.get('/', function (req, res) {

    res.send(__dirname + '/public/index.html'); //serves index.html when home route is hit

});

router(app);

//Server Setup


const port = process.env.PORT || 3090;
const server = http.createServer(app); //creates an http server that can receive requests and forward them to app (express())

server.listen(port);
console.log('Server listening on port:', port);

公开/ index.js

    import React from 'react';
    import ReactDOM from 'react-dom';
    import { Provider } from 'react-redux';
    import { createStore, applyMiddleware } from 'redux';
    import redux from 'redux';
    import { Router, browserHistory } from 'react-router';
    import reducers from './reducers';
    import routes from './routes';
    import promise from 'redux-promise';
    import reduxThunk from 'redux-thunk';

    const createStoreWithMiddleware = applyMiddleware(reduxThunk, promise)(createStore);

    // Load foundation
    require('style!css!foundation-sites/dist/foundation.min.css');
    $(document).foundation();


    ReactDOM.render(
      <Provider store={createStoreWithMiddleware(reducers)}>
        <Router history={browserHistory} routes={routes} />
      </Provider>
      , document.querySelector('.masterContainer'));

操作/ index.js

export function createUser(props) {

    return function(dispatch) { 

        axios.post(`/signup`, props)
            .then(response => {
                //If request is good...
                // - Update state to indicate user is authenticated
                dispatch({ type: AUTH_USER, payload: response });
                // - Save the JWT token
                localStorage.setItem('token', response.data.token);
                // - redirect to the route '/feature'
                browserHistory.push('inventory');
            })
            .catch(() => {
                //If request is bad...
                // - Show error to the user
                dispatch(authError('Email is already in use'));
            });


    }

}

export function loginUser(props) {

    return function(dispatch) { 

        axios.post(`/login`, props)
            .then(response => {
                //If request is good...
                // - Update state to indicate user is authenticated
                dispatch({ type: AUTH_USER, payload: response});
                // - Save the JWT token
                localStorage.setItem('token', response.data.token);
                // - redirect to the route '/feature'
                browserHistory.push('/inventory');
            })
            .catch(() => {
                //If request is bad...
                // - Show error to the user
                dispatch(authError('Incorrect email or password'));
            });


    }

}

browserHistory推送到下一个路由，但页面不会在浏览器中加载

0 个答案: