当SearchBar和它的父级的setter一起作为道具出现时，它不会更新值

是因为React中的props是只读的，不能直接在子组件中修改父组件传递的props值。这是为了确保数据流的单向性和可预测性，防止意外修改父组件的状态。

如果想要在子组件中更新props的值，可以通过使用回调函数来实现。父组件可以定义一个回调函数，作为props传递给子组件，并在子组件中调用该回调函数来更新父组件的状态。具体步骤如下：

父组件定义一个状态，并通过props将该状态传递给子组件：

class ParentComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      searchBarValue: ''
    };
  }

  updateSearchBarValue = (value) => {
    this.setState({ searchBarValue: value });
  }

  render() {
    return (
      <ChildComponent searchBarValue={this.state.searchBarValue} updateSearchBarValue={this.updateSearchBarValue} />
    );
  }
}

子组件接收父组件传递的props，并在需要更新值的地方调用回调函数：

class ChildComponent extends React.Component {
  handleChange = (event) => {
    const value = event.target.value;
    this.props.updateSearchBarValue(value);
  }

  render() {
    return (
      <input type="text" value={this.props.searchBarValue} onChange={this.handleChange} />
    );
  }
}

通过这种方式，子组件的输入框的值发生变化时会调用回调函数updateSearchBarValue，从而更新父组件的状态searchBarValue，实现了在子组件中更新父组件传递的props值的目的。

腾讯云相关产品推荐链接：