一种状态下降，一种没有答案

【问题标题】：One state goes down and one doesn't一种状态下降，一种没有
【发布时间】：2020-01-22 08:56:33
【问题描述】：

我的状态为 {onView: '0'}，作为我的 View 组件的道具。但是状态 {min: 0, max: 100} 并没有下降到我的 Range 组件。我哪里做错了？

App.js：

export class Generator extends React.Component {
  constructor (props) {
    super(props)
    this.state = { 
        onView: '0',
        min: 0,
        max: 100
    } 
  }

  render() {
    var btnClick = () => {
      var x = Math.ceil(Math.ceil(Math.random()) / Math.random());
      return this.setState({ onView : x });
    };
    return (
      <div className="container">
        <Instructions />
        <Range max={this.state.max} min={this.state.min} />
        <Generate currentClick={btnClick} />
        <View show={this.state.onView} />
      </div>
    );
  }
}

export default Generator;

查看组件：

 const View = ({ show }) => {
   return (
    <div className="view">
    <h1>{show}</h1>
    </div>
   );
 }

export default View;

范围组件：

class Range extends React.Component {
  constructor(props) {
    super(props)
  }
  render() {
    return (
      <div className="rangeDiv">
        <input type="text" value={this.min}/>
        <input type="text" value={this.max}/>
      </div>
    );
  }
}

export default Range;

如果有任何帮助，我将不胜感激，谢谢！

【问题讨论】：

因为您使用的是this.min 而不是this.props.min？

标签： reactjs jsx

【解决方案1】：

请尝试一下！我猜你错过了那里的道具

<input type="text" value={this.props.min}/>

【讨论】：

【解决方案2】：

您使用的是this.min 而不是this.props.min，max 也是如此。试试这个：

class Range extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    const { min, max } = this.props;
    return (
      <div className="rangeDiv">
        <input type="text" value={min} />
        <input type="text" value={max} />
      </div>
    );
  }
}

export default Range;

【讨论】：