Question

{
      this.props.favoriteButton ?
        this.state.favorited ?
          <div className="star">&#9733;</div>
        :
          <div 
            className="star"
            onClick={() => this.favorite(recipe)}
          >
            &#9734;
          </div>
      :
        <div></div>
    }

如果在进行反应中的三元语句之前有多个？这意味着必须满足两个条件意味着什么？这个陈述是如何起作用的......相当混淆......

Answer 1

转换为简单的ifs后：

if (this.props.favoriteButton) {
    if (this.state.favorited) {
        return <div className="star">&#9733;</div>;
    } else {
        return <div className="star" onClick={() => this.favorite(recipe)}>&#9734;</div>;
    }
} else {
    return <div></div>
}

Answer 2

当第一个条件不满足时，第二个条件并不重要

＆＃13;

const x = document.getElementById("x")
const y = document.getElementById("y")
const result = document.getElementById("result")
x.addEventListener("change", showResult)
y.addEventListener("change", showResult)

function showResult() {
  return result.textContent =
  x.checked ?
    y.checked ?
      "x and y checked"
      : "x checked, y unchecked"
    : "x unchecked, y whatever"
}

showResult()

＆＃13;

<input type="checkbox" id="x"/>
<input type="checkbox" id="y"/>
<p id="result"></p>

＆＃13;

你如何使用React中的多个？和：来解决三元运算符

2 个答案: