無法完成顯示警報的反應原生REDX應用程序

Question

我有一個reducer登錄到應用程序。
我想在出現問題時顯示Alert。
可調度登錄動作顯示模式的動作：

export function loginUser(username, password) { ... 
    dispatch({type: 'SHOW_MODAL', modalType: 'SUCESSFULL_LOGIN'}) 

莫代爾減速機：

export default function reducer(state={}, action) { 
    switch (action.type) { 
    case 'SHOW_MODAL': 
     return { 
     modalType: action.modalType 
     } 
    } 
    return state 
} 

但現在我不知道接下來要去哪裏。
在哪裏閱讀state現在和顯示Alert視圖。

Answer 1

您需要將組件連接到redux並從狀態獲取所需的屬性。 例子：

const stateMap = (state, props, ownProps) => { 
    return(
     /* Here all your state */ 
     /* name_property: state.name_action_import.name_property_on_state*/ 
     modalType: state.login.modalType 
    ) 
} 

function mapDispatchToProps(dispatch) { 
    return { 
     // This you put action on this component if you need 
    }; 
}; 

在這裏您將設備連接到終極版

export default connect(stateMap, mapDispatchToProps)(Alers); 

而在組件這個變量，你可以從喜歡的道具獲得： this.props.modalType

你的部件警示會像：

import React from "react"; 
import { connect } from 'react-redux'; 
import login from './../../../actions'; /* Here your inport to action */ 

class Alers extends Component { 
    render() { 
     return (
      <div > 
       {this.props.modalType /*here you property from state */} 
      </div> 
     ); 
    } 
} 


const stateMap = (state, props, ownProps) => { 
    return { 
     modalType: state.login.modalType 
    }; 
}; 

function mapDispatchToProps(dispatch) { 
    return { 
    }; 
}; 

export default connect(stateMap, mapDispatchToProps)(Alers);