发布于 

JSX基本使用

Babel会把JSX转译成一个名为React.createElement()函数调用

原生创建recat元素:

1
const span = React.createElement('span', null, 'span')

用JSX创建react元素:

1
const ul = <div><ul><li><span>hello worde!!!</span></li></ul></div>

JSX中使用JS表达式:

语法:{JavaScript表达式}

注:语法中是单大括号,不是双大括号

1
2
3
4
const name = 'kl'
const div = (
<div>XXX:{name}</div>
)

使用jsx注意事项:自身也是js表达式

​ 1.添加类名需小驼峰命名法:第一个单词首字母小写,从第二个单词及以后的首字母是大写开头

​ 2.声明的jsx元素需圆括号下只能有一个根元素

3.不能在{}中出现语句和对象(if/for,{a:555}等)

数据类型支持:

单大括号:值、变量、函数调用、三元运算符、数组(基本类型,jsx)


本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。