Привет. Я отправляю значение из выбора в хранилище с избыточностью:
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);
С помощью консоли я вижу, как работает, и действие меняется каждый раз, когда я использую выбор.
Это часть кода i, где я собираюсь в магазин, чтобы получить реквизит:
const mapStateToProps = state => {
console.log("recibe mapStateToProps: ", state)
return {
token: state.token,
ValorState: state.ValorState,
username: state.username,
selectvalue: state.value // <<<---- This one
};
};
Это реквизит получено:
Почему я всегда неопределен? Если мой компонент подключен к хранилищу, когда изменение значения не должно получить значение?
Информация о коде редуктора: (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;