Javascript 访问redux存储属性时遇到问题

我正在尝试使用MERN堆栈为列表创建一个编辑表单。我试图用redux存储中的动态信息填充表单中的输入字段。我相信我能找到它，但它现在正在展示。我认为这与我的减缩或动作逻辑有关

ClientEditModal.js

import React, { Component } from "react";
import {
  Button,
  Modal,
  ModalHeader,
  ModalBody,
  Form,
  FormGroup,
  Label,
  Input,
} from "reactstrap";
import { connect } from "react-redux";
import { editClient } from "../actions/clientActions";
import PropTypes from "prop-types";

class ClientEditModal extends Component {
  state = {
    modal: false,
  };

  componentDidMount() {
    this.props.editClient();
  }

  toggle = () => {
    this.setState({
      modal: !this.state.modal,
    });
  };

  onChange = (e) => {
    this.setState({ [e.target.name]: e.target.value });
  };

  onSubmit = (e) => {
    e.preventDefault();

    // Close modal
    this.toggle();
  };

  render() {
    const { clients } = this.props.client;
    return (
      // Split button into separate component
      <div>
        <Button
          color="dark"
          style={{ marginBottom: "2rem", marginLeft: "1rem" }}
          onClick={this.toggle}
        >
          Edit
        </Button>

        <Modal isOpen={this.state.modal} toggle={this.toggle}>
          <ModalHeader toggle={this.toggle}> Edit</ModalHeader>

          <ModalBody>
            <Form onSubmit={this.onSubmit}>
              <FormGroup>
                <Label for="name"> Name </Label>
                <Input
                  type="text"
                  name="name"
                  id="client"
                  value={clients.name}
                  onChange={this.onChange}
                ></Input>
                <Label for="email"> Email </Label>
                <Input
                  type="text"
                  name="email"
                  id="client"
                  value={clients.email}
                  onChange={this.onChange}
                ></Input>
                <Label for="number"> Number </Label>
                <Input
                  type="text"
                  name="number"
                  id="number"
                  value={clients.number}
                  onChange={this.onChange}
                ></Input>
                <Button color="dark" style={{ marginTop: "2rem" }} block>
                  Submit Client Edit
                </Button>
              </FormGroup>
            </Form>
          </ModalBody>
        </Modal>
      </div>
    );
  }
}

ClientEditModal.propTypes = {
  editClient: PropTypes.func.isRequired,
  client: PropTypes.object.isRequired,
};

const mapStateToProps = (state) => ({
  client: state.client,
});

export default connect(mapStateToProps, { editClient })(ClientEditModal);

clientReducer.js——编辑客户端

    case EDIT_CLIENT:
      return {
        ...state,
        clients: [action.payload, ...state.clients],
      };

---

您是否曾经使用react-redux的connect HOC.import{connect}从“react-redux”将组件连接到存储？确保已将状态映射到ClientEditModal.js中的道具，并使用redux的connect HOC连接组件。在你的问题中，除了简单地说“没有显示”之外，确切地提及正在发生的事情也会有所帮助。您是否收到任何错误消息，如果是，它们是什么？const-mapStateToProps=（state）=>（{client:state.client，}）；没有错误消息。只有空旷的田野。因此，它看起来似乎可以工作，但没有呈现任何内容。您是否曾经使用react-redux的connect-HOC.import{connect}from“react-redux”将组件连接到存储？确保已将状态映射到ClientEditModal.js中的道具，并使用redux的connect HOC连接组件。在你的问题中，除了简单地说“没有显示”之外，确切地提及正在发生的事情也会有所帮助。您是否收到任何错误消息，如果是，它们是什么？const-mapStateToProps=（state）=>（{client:state.client，}）；没有错误消息。只有空旷的田野。所以它看起来好像是工作的，但它没有呈现任何东西。

    case EDIT_CLIENT:
      return {
        ...state,
        clients: [action.payload, ...state.clients],
      };