[Daily practice] Using JS expressions in JSX

Variables used in JSX to JS

grammar:

{JS  expression }
 

Note: To distinguish the difference expression of double curly braces in html in Vue

 

 

//1.识别常规的变量
const name='JackWoot'

//2.原生方法调用
const age=()=>{
  return 22
}

//3.三元运算符
const flag=false

function App() {
  return (
    <div className="App">
    <h1>{name}</h1>
    <h1>{age()}</h1>
    <h1>{flag? '真棒':'SB'}</h1>
    </div> 
  );
}

export default App;