JSX语法

JSX语法

---

是JavaScript和XML的缩写，是在JS代码中编写HTML模板 （需要解析工具解析完才能在浏览器中运行）。例子如下

const msg = 'abc'
function App () {
    return (
    	<div>
        	<h1>{msg}</h1>
        </div>
    )
}

1.{}语法

const msg = 'abc'
function App () {
    return (
    	<div style={{ color:'red' }}>  <!--引用样式-->
        	<h1>{ msg }</h1> <!--变量-->
            <h1>{ '123' }</h1> <!--引号使用字符串-->
            <h1>{ getName() }</h1> <!--引号函数-->
        </div>
    )
}

<!--注意
1. 单打括号中可以是任意的 JavaScript 表达式，例如：三元表达式，加减乘除，数组，字符串
2. 单大括号中不能出现语句(例如：if/for等)
3. JS 对象一般只会出现在style属性中
--!>