学习目标: 能够在 JSX 中使用表达式
语法:
{JS 表达式}
function App() {
// 1.识别常规变量
const name = '跟着老惠学前端'
// 2.原生js方法调用
const age = () => {
return 25
}
//3.三元运算符
const flag = true
return (
<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>
)