Question

我有一个React项目，它正在使用Recompose。假设我有一个Form，并且提供了一个.with的“ withHandler”。

提交表单后，我还如何更改React组件的状态？

Answer 1

因此，假设表单是使用button提交的，并且按钮上具有onClick属性。

这是一个非常简单的示例，但希望向您展示如何使用onClick更新状态。请记住，这是一个可以应用于HTML元素的属性。您可以the onClick attribute here来了解它。

import React, { Component } from 'react';

import React from "react";
import { render } from "react-dom";
import Component from "react-component-component";

class Button extends Component {
  state = {
    counter: 0
  };

  handleButtonClick = () => {
    this.setState({
      counter: this.state.counter + 1
    });
  };

  getButton = () => {
    const { text } = this.props;

    return (
      <button
        onClick={this.handleButtonClick}
      >
        {text}
        {this.state.counter}
      </button>
    );
  };

  render() {
    return <div>{this.getButton()}</div>;
  }
}

render(
  <Button text="press me to increase counter: " />,
  document.getElementById("root")
);

在此处可以看到以下内容：https://codesandbox.io/s/ly11qv0vr7

关于处理事件的反应文档也有一个很好的例子。您可以阅读有关handling events in react here的信息。我相信上面的链接将为您提供处理正在提交的表格所需的所有信息。

如何在处理程序中更改状态

1 个答案: