代码之家 › 专栏 › 技术社区 › maverick

如何在更改时分派值

dispatch redux reactjs

maverick · 技术社区 · 6 年前

我正在构建一个搜索组件,我已经设置了我的操作和还原器等等…但我不知道如何在组件中分派事件。onChangeValue属性中应该包含什么?

代码如下:

import React from "react";
import { connect } from "react-redux";
import { getListOfUsers, clearDetails } from "../../actions/actions";
import SearchBar from "../../components/search/search";

const SearchBarContainer = onChangeValue => {
  return <SearchBar onChangeValue={onChangeValue} id="search" icon="search" />;
};

const mapStateToProps = state => {
  return {};
};

const mapDispatchToProps = dispatch => {
  return {
    onChangeValue: e => {
      dispatch(getListOfUsers(e.target.value));
      dispatch(clearDetails());
    }
  };
};

const connected = connect(
  mapStateToProps,
  mapDispatchToProps
)(SearchBarContainer);

export default connected;

2 回复 | 直到 6 年前

Shubham Khatri 6 年前

SearchBarContainer 是一个功能组件,因此它不会 state 或 this 变量。你得从道具上拿下来。还有调度功能 onChangeValue 可作为容器的支柱。

const SearchBarContainer = ({ onChangeValue, value }) => {
  return (
    <SearchBar
      onChangeValue={onChangeValue}
      value={value}
      id="search"
      icon="search"
    />
  );
};

Midhun G S 6 年前

改变

<SearchBar
      onChangeValue={onChangeValue}
      value={this.state.value}
      id="search"
      icon="search"
    />

到

<SearchBar
          onChangeValue={this.props.onChangeValue}
          value={this.state.value}
          id="search"
          icon="search"
        />

推荐文章