当前位置: 首页 > 工具软件 > JSX > 使用案例 >

jsx表达式

周鸿光
2023-12-01

语法: { }

嵌入js表达式注意点:

1、在大括号里可以是任意合法的js表达式(数字,字符串,布尔都是合法的js表达式,变量);
2、还可以是函数(有返回值) 函数调用也是表达式
3、jsx本身也是表达式
4、表达式中不能使用对象,但是style中是可以使用的
5、不能在表达式中出现语句(if/for等)

// 导入react
// 1、导入
import React from "react"
import ReactDom from "react-dom"
// 2、创建元素
const name = (<h1 className="name">张凯帆 <span /></h1>) 
// 3、渲染
ReactDom.render(name,document.getElementById('root'))
// 表达式
const sayHi = () => 'hi';
const name1 = '凡夫俗子';
const intru = (<div>你好,我叫:
  {name1}
  {8}
  {1+666}
  {'nan'}
  <p>{3>5 ? "确实大于":"并不大于"}</p>
  <p>{sayHi}</p>
  <p>{name}</p>
  </div>)
ReactDom.render(intru,document.getElementById('root'))
 类似资料: