Question

我们可以将状态值分配给redux吗？

我只是想将选定的值放入redux中，以便可以从父组件访问它。还有其他方法可以访问子组件的选定值。我有redux对象，但无法从此子组件将数据放入其中。但是ı可以从父级使用它。Helpplz

当我尝试这个时。我有一个错误。诸如此类的东西

class Dropdown extends Component {

    constructor(props) {
        super(props)
        this.state = {
            value: this.props.placeHolder,
            data: [],
            selectedOption: null,
            selectedOption2: null
        }
        this.handleChange = this.handleChange.bind(this)
        this.handleChangeDestination = this.handleChangeDestination.bind(this)
    }
    filterDestinationList(data) {
        if (this.state.selectedOption != null) {
            let filteredData = data.filter(arrayItem => arrayItem.label !== this.state.selectedOption.label);
            LocationsActions.reloadDestinationList(filteredData)
        }
    }

    handleChange = (selectedOption) => {
        this.setState({ selectedOption });
        console.log(`Option selected:`, selectedOption);
        let location = this.state.selectedOption

        LocationsActions.setOrigin(location)//when I use this, got an error
    }

    handleChangeDestination = (selectedOption2) => {
        this.setState({ selectedOption2 });
        console.log(`Option selected:`, selectedOption2);
    }
    render() {


        if (this.props.type == "from") {
            const { selectedOption } = this.state;
            return (

                <div style={dropDownHolder} className="from-dropdown">
                    <div>
                        <h4>{this.props.title}</h4>
                    </div>

                    <Select
                        value={selectedOption}
                        defaultValue={this.props.selectedItem}
                        onChange={this.handleChange}
                        options={this.props.originList}
                        onBlur={() => { this.filterDestinationList(this.props.originList) }}
                    />

                </div>
            );
        }
        if (this.props.type == "to") {
            const { selectedOption2 } = this.state;
            return (
                <div style={dropDownHolder} className="from-dropdown">
                    <div>
                        <h4>{this.props.title}</h4>
                    </div>
                    <Select
                        value={selectedOption2}
                        defaultValue={this.props.selectedItem}
                        onChange={this.handleChangeDestination}
                        options={this.props.destinationList}
                    />

                </div>)
        }
    }
}
export default Dropdown;

Answer 1

是的，您可以

您需要执行以下步骤：

创建动作类型，例如

const SET_FILTER = 'SET_FILTER';

创建动作

const setFilter = filter => dispatch({ type: SET_FILTER, payload: filter });

在减速器中处理

case SET_FILTER:
  return {
    ...state,
    filter: action.payload
  }

在需要的地方使用您的组件绑定此操作和值

connect(state => ({ filter: state.someReducer.filter }), { setFilter: actions.setFilter })(YourComponent)

如何设置过滤器

this.props.setFilter(value);

这是您可以在父级中访问该值的方式

this.props.filter

无法在handleChange中使用Redux set函数

1 个答案: