如何使用react更新和显示setState上的第一个非空值？

constructor(props) {
  super(props);
  this.state = {
    value1: '',
    value2: '',
    value3: ''
  };
}

componentDidMount() {
  const { value1, value2, value3 } = this.state;
  let firstNonNullValue = '';
  
  if (value1 !== '') {
    firstNonNullValue = value1;
  } else if (value2 !== '') {
    firstNonNullValue = value2;
  } else if (value3 !== '') {
    firstNonNullValue = value3;
  }
  
  this.setState({ firstNonNullValue });
}

render() {
  const { firstNonNullValue } = this.state;
  
  return (
    <div>
      First Non-Null Value: {firstNonNullValue}
    </div>
  );
}