2017-04-12 21 views
-1

私のアクションから正しいオブジェクトを取得している状態ですが、実際には状態に追加されていないようです。 React-Reduxで手を貸すことができる減速機で作業している人はいますか?なぜ私は新しい状態を返すことができないのか分からない。React-Reduxユーザー状態が更新されていません

ここには、私が現在行っているコードがあります。

import * as types from '../constants' 
const defaultState = {} 
const userReducer = (state = defaultState, action) =>{ 
    switch(action.type){ 
     case types.USER_LOGGED_IN: 
      console.log("in the logged in reducer") 
      console.log(action.cookie) 
      return { 
       ...state, 
       cookie: action.cookie 
      } 
     case types.USER_LOGGED_OUT: 
      return state 
     default: 
      return state   
    } 

} 

export default userReducer 

console.logは実際に私にとって正しいクッキー値を表示します。どんなアイデアや助けも大歓迎です。ここではリクエストごと

はここ

import React, { Component, PropTypes } from 'react' 
import { routerActions } from 'react-router-redux' 
import { connect } from 'react-redux' 
import GoogleLogin from '../components/GoogleLogin' 
import actions from '../actions/' 
import cookie from 'react-cookie' 
const login = actions.userActions.login 

function select(state, ownProps) { 
    const isAuthenticated = state.user.cookie || false 
    console.log(isAuthenticated) 
    const redirect = ownProps.location.query.redirect || '/' 
    return { 
    isAuthenticated, 
    redirect 
    } 
} 

class LoginContainer extends Component { 



    componentWillMount() { 
     const { isAuthenticated, replace, redirect } = this.props  
     if (isAuthenticated) { 
     replace(redirect) 
     } 

    } 

    componentWillReceiveProps(nextProps) { 
     const { isAuthenticated, replace, redirect } = nextProps 
     const { isAuthenticated: wasAuthenticated } = this.props 

     if (!wasAuthenticated && isAuthenticated) { 
     replace(redirect) 
     } 
    } 

    onClick(e){ 
     e.preventDefault() 
     //console.log("in the onClick") 
     var status = cookie.load("MarketingStatsApp",false) 
     if(!(status == undefined)){ 
     const login = actions.userActions.login 
     this.props.login({ 
     cookie: status 

     }) 
     } 

     window.location.href='auth/google' 

    }; 

    render() { 
     return (
     <div> 
      <h1>Login using Google</h1> 
      <GoogleLogin onClick={this.onClick.bind(this)}/> 
     </div> 
    ) 
    } 

} 

export default connect(select, { login, replace: routerActions.replace })(LoginContainer) 

あなたが見ることができ、コンテナである偽を通じて初めてプリントアウトを取得して、クッキーがプリントアウトされます。あなたも、アクションを見ることができますが、私はそのアクションの矢印にクリックすることはできませんし、他のものは、私はそれが助けを

enter image description here

+1

これは私にとってはちょっと見えます。あなたはどうやって問題を観察していますか?私は問題があなたが減量する人ではなく、州を使用している場所であると考えています。 –

+0

はいレデューサーは大丈夫です。コンテナのコー​​ドを提供してください –

+0

助けてくれてありがとう、私はポストにコンテナを追加しました – Peter3

答えて

0

のおかげであることを期待する方法として、更新された状態が表示されません全員

問題は私のルーターページの二重確認になってしまった。私はそれが適切に起動するためにアクション変数を再導入する必要がありました。ここにはそのコードがあります

import { Router, Route, browserHistory,IndexRedirect } from 'react-router' 
import React from 'react'; 
import Layout from './components/Layout' 
import Home from './containers/Home' 
import Login from './containers/LoginContainer' 
import Dashboard from './containers/Dashboard' 

import { UserIsAuthenticated} from './util/wrapper' 
import cookie from 'react-cookie' 
import axios from 'axios' 
import actions from './actions' 
import store from './reducers'; 
const Authenticated = UserIsAuthenticated((props) => props.children) 


function doubleCheckGUID(guid){ 

    return axios.post("/auth/guid",{guid: guid}).then(response => { 

    const login = actions.userActions.login 
    store.dispatch(login({ 
      cookie: cookie.load("MarketingStatsApp",false) 
     })) 

    return true; 
    }).catch(error => { 
    return false; 
    }) 

} 
if(cookie.load("MarketingStatsApp",false)){ 
    doubleCheckGUID(cookie.load("MarketingStatsApp",false)) 
} 


const AppRouter =() => 
    <Router history={browserHistory} > 
    <Route path="/" component={Layout}> 
     <IndexRedirect to="/home" /> 
     <Route path="home" component={Home} /> 
     <Route path="login" component={Login}/> 
     <Route component={Authenticated} > 
      <Route path="dash" component={Dashboard} /> 
     </Route> 
    </Route> 
    </Router> 

export default AppRouter 
関連する問題