在您的父组件中，您可以创建一个函数addTodoItem，它会执行所需的 setState，然后将该函数作为props传递给子组件。

var Todos = React.createClass({

  ...

  addTodoItem: function(todoItem) {
    this.setState(({ todos }) => ({ todos: { ...todos, todoItem } }));
  },

  render: function() {

    ...

    return <div>
      <h3>Todo(s)</h3>
      {todos}
      <TodoForm addTodoItem={this.addTodoItem} />
    </div>
  }
});

var TodoForm = React.createClass({
  handleClick: function(e) {
    e.preventDefault();
    this.props.addTodoItem(this.state.todoInput);
    this.setState({todoInput: ""});
  },

  ...

});

您可以addTodoItem在 TodoForm 的 handleClick 中调用。这将在父项上执行 setState ，它将呈现新添加的待办事项项。希望你能明白。

在这里摆弄。

这些基本上都是正确的，我只是想我会指出新的（ish）官方react文档，它基本上推荐：-

对于在 React 应用程序中更改的任何数据，都应该有一个“真实来源”。通常，状态首先添加到需要它进行渲染的组件中。然后，如果其他组件也需要它，您可以将它提升到它们最近的共同祖先。您应该依赖自上而下的数据流，而不是尝试在不同组件之间同步状态。

请参阅https://reactjs.org/docs/lifting-state-up.html。该页面还通过一个示例工作。

对于那些使用 React Hook 保持状态的人useState，我调整了上面的建议，在下面制作了一个演示滑块应用程序。在演示应用程序中，子滑块组件维护父组件的状态。

该演示还使用了useEffect钩子。（不太重要的是，useRef钩子）

import React, { useState, useEffect, useCallback, useRef } from "react";

//the parent react component
function Parent() {

  // the parentState will be set by its child slider component
  const [parentState, setParentState] = useState(0);

  // make wrapper function to give child
  const wrapperSetParentState = useCallback(val => {
    setParentState(val);
  }, [setParentState]);

  return (
    <div style={{ margin: 30 }}>
      <Child
        parentState={parentState}
        parentStateSetter={wrapperSetParentState}
      />
      <div>Parent State: {parentState}</div>
    </div>
  );
};

//the child react component
function Child({parentStateSetter}) {
  const childRef = useRef();
  const [childState, setChildState] = useState(0);

  useEffect(() => {
    parentStateSetter(childState);
  }, [parentStateSetter, childState]);

  const onSliderChangeHandler = e => {
  //pass slider's event value to child's state
    setChildState(e.target.value);
  };

  return (
    <div>
      <input
        type="range"
        min="1"
        max="255"
        value={childState}
        ref={childRef}
        onChange={onSliderChangeHandler}
      ></input>
    </div>
  );
};

export default Parent;

您可以在父组件中创建一个 addTodo 函数，将其绑定到该上下文，将其传递给子组件并从那里调用它。

// in Todos
addTodo: function(newTodo) {
    // add todo
}

然后，在 Todos.render 中，你会做

<TodoForm addToDo={this.addTodo.bind(this)} />

在 TodoForm 中调用它

this.props.addToDo(newTodo);

parentSetState={(obj) => { this.setState(obj) }}