JSX 中使用 js 表达式

表达式"/>

JSX 中使用 js 表达式

学习目标： 能够在 JSX 中使用表达式
语法：
{JS 表达式}

function App() {// 1.识别常规变量const name = '跟着老惠学前端'// 2.原生js方法调用const age = () => {return 25}//3.三元运算符const flag = truereturn (<div className="App">{name}{age()}{flag ? '真棒' : '真菜'}</div>)
}export default App

可以使用的表达式
 1.字符串、布尔值、数值、null、undefined、object([]/{})
 2.算数运算（1+2）、字符串方法（“abcde”.split(‘’)）、数组方法（[‘a’,‘b’].join(‘-’)）
 3. fn()
特别注意
if 语句/switch-case 语句/变量声明语句，这些叫做语句，不是表达式，不能书写在{}中！！！

// 1.识别常规变量
const name = '跟着老惠学前端'
// 2.原生js方法调用
const age = () => {return 25
}
//3.三元运算符
const flag = true
// 其他的自行尝试...
return (<div className="App">{name}<br />{age()}<br />{flag ? '真棒' : '真菜'}<br /></div>
)