React.js의 삼항 연산에 대한 설명

이 글은 React.js의 삼항 연산에 관한 글입니다. React.js의 삼항 연산에 대해 잘 모르시거나 이해하지 못하신다면 이 글을 함께 살펴보세요! 쓸데없는 말은 생략하고 바로 본론으로 들어가겠습니다!

1.삼항연산

//在js中定义一个style属性，可参见reactjs(一)
var style = {
   background-color:"green";
}

var Message = React.createClass({
    render:function(){
       return{               //三元运算要被包裹在花括号中。因为花括号不能写在return的第一层，所以必须要在外围嘛加一个p标签
           <p>
             {false?<h1 style={style}>齐天大圣</h1>}           </p>
       }
    }

})

if 조건문 적용

var Message = React.createClass({
    render:function(){
          if(true){
               return(
                <h1>孙悟空</h1>
            )    
            };
})

비교연산자

var Message = React.createClass({
    render:function(){
         return(
         <p>
            {
                true  || <h1 style = {style}>孙悟空</h1>
}
         </p>
)
            };
})

이상은 이 글의 3가지 요소를 모두 이해하시길 바랍니다. .js 메타 연산에 대해 잘 모르는 분들은 자세히 살펴보세요!

관련 추천:

React.js props

위 내용은 React.js의 삼항 연산에 대한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!