Question

嗨，所以我这里有这个小提琴{{3}}，它运作正常。但是我想知道为什么我不能替换

printf("\n%s",stackValue);

与

var clickHandler = this.props.onRatingSelected && this.props.onRatingSelected.bind(null, i);
items.push(<li key={i} className={i <= this.props.value && 'filled'} onClick={clickHandler}>{'\u2605'}</li>);

假设我跳过了理智检查。

Answer 1

你的小提琴 FundooRating 组件中的

被称为，有或没有 onRatingSelected道具。

 <div>
  Rating is {this.state.rating} <br/>
  Clickable Rating <br/>
  <FundooRating value={this.state.rating} max="10" onRatingSelected={this.handleRatingSelected.bind(this)} />
  <br />
  Readonly rating <br/>
  <FundooRating value={this.state.rating} max="10" />
</div>

所以你必须在替换代码中检查null个案

items.push(<li key={i} className={i <= this.props.value && 'filled'} onClick={this.props.onRatingSelected && this.props.onRatingSelected.bind(null, i)}>{'\u2605'}</li>);

Sample Fiddle

Answer 2

您需要检查

this.props.onRatingSelected

因为您有一个 FundooRating 的实例，所以您不会将处理程序作为道具传递：

 <FundooRating value={this.state.rating} max="10" />

（正好在 Readonly 文本下方）。

ReactJS在for循环中分配单击处理程序

2 个答案: