<body>
<!-- React 真实 DOM 将会插入到这里 -->
<div id="example"></div>

<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 语法格式转换器 -->
<script src="src/libs/JSXTransformer.js"></script>

<script src="src/libs/jquery.js"></script>
<!-- 注意：script 需要注明 type 为 text/jsx 以指定这是一个 JSX 语法格式 -->
<script type="text/jsx">
var MessageBox = React.createClass({
getInitialState:function () {
return {
isName:true
}
},
getClassName : function () {
return this.state.isName ? 'MyName' : 'NoName'
},
render:function () {
return <div className={this.getClassName()}>11111111111</div>
}
})
React.render(
<MessageBox />,
document.getElementById('example')
)
</script>
</body>

JSX中，不能使用 if/else语句，替代方案：三目运算符

注意，这里说的是在HTML中不能使用if/else语句，在函数中依然可以使用。

react7 react 三目运算的更多相关文章

  1. ng-class结合三目运算

    ng-class文档:https://docs.angularjs.org/api/ng/directive/ngClass 但是在实际项目中可能会用到三目运算,实例如下: <ul> &l ...

  2. angularjs的三目运算

    前言:前几天写代码的时候遇到一个问题,有一个按钮,有"已关注"和"+关注"两种状态,需要对这两种状态的按钮的背景颜色进行区分,单后点击"已关注&quo ...

  3. 【Python全栈笔记】03 [模块二] 16-17 Oct Set 集合，三目运算

    Set 集合 set - unordered collections of unique elements 创建一个set/一个空set # create a new set set1 = {1,2, ...

  4. python函数，lambda表达式，三目运算，列表解析，递归

    一.自定义函数 定义函数时,函数体不执行:只有在调用函数时,函数体才执行.函数的结构: 1. def 2. 函数名 3. 函数体 def func_name(): 函数体 4. 返回值 如果没有声明返 ...

  5. 三目运算的使用&bytes类型转str类型

    一.三目运算的使用 就像c语言中有三目运算符一样,python中也有三目运算符,废话不多说直接上代码 a=3 c=4 b=a if a>c else c print(b) 意思就和 if a&g ...

  6. 三目运算：and/or 技巧

    三目运算:and/or 技巧 and, or 联合起来有个小技巧: print 2 < 3 and True or False 说明:     如果  2 小于 3 了,则输出 True ,  ...

  7. js switch判断 三目运算 while 及 属性操作

    三 目运算:如var a = 10: var b= 12: c = a>b ?a:b; 若成立执行a否则执行b var isHide = true; 若用if判断语句如下 if(isHide) ...

  8. day09三目运算

    内容详细 1.三目运算(三元运算) v=前面 if 条件 else 后面 if 条件: v="前面" else: v="后面" #让用户输入值,如果值是整数,则 ...

  9. python运算符,数据类型,数据类型操作,三目运算,深浅拷贝

    算数运算符: Py2中精确除法需要导入:from __future__ import division,(符由特  ,将来的.滴未省,除法) py3不需要导入 赋值运算符: 比较运算符: 成员运算符: ...

随机推荐

  1. 黑马程序员－scanf函数

    变量的内存:字节和地址:1.变量的存储单位是字节,每个字节都有存储地址.2.不同的数据大小占用的内存带下不同拥有的字节数也是不同的.变量的存储:1.存储是按照,先存储的放在地址教高的位置,优先存储的地 ...

  2. [Leetcode][JAVA] Flatten Binary Tree to Linked List

    Given a binary tree, flatten it to a linked list in-place. For example,Given 1 / \ 2 5 / \ \ 3 4 6   ...

  3. Android editview 设置只能输入数字、字母和汉字

    Android editview 设置只能输入数字.字母和汉字 当处理密码.昵称等特殊情况的时候,往往需要对输入内容加以限制.对于单纯的一种输入法限制可以对键盘和editview熟悉进行控制,而对于多 ...

  4. vertica在电信的应用

    本文介绍了什么 ´ 电信级大数据分析典型需求 ´ Vertica数据库特点及与其他数据库对比 ´ Vertica核心技术介绍 ´ 基于Vertica的典型分系统架构简介 电信级大数据分析典型需求 ´  ...

  5. alfresco install in linux, and integrated with tesseract ocr

    本文描述在Linux系统上安装Alfresco的步骤: 1. 下载安装文件:alfresco-community-5.0.d-installer-linux-x64.bin 2. 增加执行权限并执行: ...

  6. 树莓派3B安装pybluz

    按如下流程: apt-get install python-dev apt-get install python-pip apt-get install libbluetooth-dev pip in ...

  7. bzoj 3718

    题意:戳这里 思路:很容易发现对于一个车能否移动到最终的位置只要判断路径中得最大高度与自身高端之和是否>w即可. 那么就可以转化为逆序对得最大数问题..即对于每一辆车,判断有那些最初在他前面,而 ...

  8. (原创)Louis Aston Knight 的家(摄影，欣赏)

    本文图片转自腾讯文化:www.cal.qq.com 1.Abstract     记忆中的家,深情刻画. 2.Content 图1 图2 图3 图4 图5 图6 图7 图8 图9 图10 图10 图1 ...

  9. JavaScript 学习笔记（一）

    1.javascript中,值包括原始值和对象,原始值包括布尔值.数字.字符串.null和undefined,其他的值为对象. 原始值的特点:(1)按值进行比较:3===3> true; 'ab ...

  10. 【转】js写显示农历的日期

    网上查找了个,记录下. <body> <!-- 中国农历开始 --> <SCRIPT language=JavaScript> <!-- var lunarI ...