首頁 > web前端 > js教程 > react.js中的三元運算講述

react.js中的三元運算講述

韦小宝
發布: 2018-03-14 10:01:24
原創
2530 人瀏覽過

本篇文章是關於react.js中的三元運算,對於react.js中的三元運算不熟悉或是不了解的,我們可以一起來看看這篇文章!廢話不那麼多直接進入主題吧!

一.三元運算

//在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>
)
            };
})
登入後複製
以上就是本篇文章的所有內容,希望大家對react.js中的三元運算不太了解的可要好好看看了!

相關推薦:

#React.js之props

以上是react.js中的三元運算講述的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板