[英]How to receive in a component a value previously dispached to redux store. (always undefined)
Hi I am sending the value from a select to a redux Store:嗨,我正在将值从 select 发送到 redux 商店:
import React, { Component } from 'react';
import { Select } from 'antd';
import { connect } from "react-redux";
import * as actions from '../store/actions/select';
class SelecionarCrypto extends Component {
constructor(props) {
super(props);
this.onChange = this.onChange.bind(this);
this.onBlur = this.onBlur.bind(this);
this.onFocus = this.onFocus.bind(this);
this.onSearch = this.onSearch.bind(this);
console.log("(SelecionarCryto.js):",this.props);
this.state = {
ValorState: "nada"
}
};
onChange(value) {
console.log(`selected ${value}`);
this.setState({ValorState: value});
console.log("(SelecionarCryto.js) New value onchange", this.state.ValorState)
this.props.onSelectCrypto(value)
}
onBlur() {
console.log('blur');
}
onFocus() {
console.log('focus');
}
onSearch(val) {
console.log('search:', val);
}
render(){
const { Option } = Select;
console.log("(SelecionarCryto.js) New value Render: ", this.state.ValorState)
return (
<Select
showSearch
style={{ width: 200 }}
placeholder="Seleciona:"
optionFilterProp="children"
onChange={this.onChange}
onFocus={this.onFocus}
onBlur={this.onBlur}
onSearch={this.onSearch}
filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
>
<Option value="ETH">ETH</Option>
<Option value="BTC">BTC</Option>
<Option value="XRP">XRP</Option>
</Select>
);
}
}
const mapStateToProps = state => {
return {
token: state.token,
selectvalue: state.value
};
};
//Dispaching to STORE:
const mapDispatchToProps = (dispatch) =>{
return{
onSelectCrypto: (value) => dispatch(actions.SelectCrypto(value))
}
};
export default connect(mapStateToProps, mapDispatchToProps)(SelecionarCrypto);
Using the console I see how is working and the action is changin every time when I am using the select.使用控制台,我看到每次使用 select 时的工作方式和操作都在变化。
This parte ot the code i where I am conecting to the store to receive the props:这部分代码是我连接到商店以接收道具的地方:
const mapStateToProps = state => {
console.log("recibe mapStateToProps: ", state)
return {
token: state.token,
ValorState: state.ValorState,
username: state.username,
selectvalue: state.value // <<<---- This one
};
};
This is the props recived:这是收到的道具:
Why i always undefined?为什么我总是未定义? If my component is connected to the store when the value changes is not supposed to get the value?
如果我的组件在值更改时连接到存储不应该获取值?
Information about the reducer code: (parte os the code: )关于减速器代码的信息:(部分代码:)
const SelectCryptoValue = (state, action) => { // <--- This one.
console.log("necesito esto:", state, " ", action)
return updateObject(state, {
selectvalue: action.value,
error: null,
loading: false
});
}
const reducer = (state=initialState, action) => {
switch (action.type) {
case actionTypes.AUTH_START: return authStart(state, action);
case actionTypes.AUTH_SUCCESS: return authSuccess(state, action);
case actionTypes.AUTH_SUCCESS_USERNAME: return authSuccessUsername(state, action);
case actionTypes.AUTH_FAIL: return authFail(state, action);
case actionTypes.AUTH_LOGOUT: return authLogout(state, action);
case actionTypes.SELECT_CRYPTO: return SelectCryptoValue(state, action);
default:
return state;
}
}
export default reducer;
Without having any idea of how your reducer is implemented it's quite hard to say but I feel there is two possibilities:如果不知道减速器是如何实现的,很难说,但我觉得有两种可能性:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.