JSX 是一个看起来很像 XML 的 JavaScript 语法扩展。 它只是一种语法糖。 它是类似 HTML 标签的表达式:
<View style={styles.text}>
<Text style={styles.title}>
MAKE IT EASY TO DO BUSINESS ANYWHERE
</Text>
<Text style={styles.subtitle}>
We aim to build the future infrastructure of commerce.
</Text>
</View>
JSX 只是 JavaScript 语法的一个语法映射。 JSX 表达式执行函数调用,我们可以看成他就是调用 createElement() 方法的快捷方式。 Babel 内置的支持 JSX 语法的编译。在代码中声明 @jsx可以定制相应的函数调用:
// Tell Babel to transform JSX into createElement() calls:
/* @jsx createElement */
import {createElement} from 'weex-rx';
<View /> // => createElement(View)
除了在代码中声明,我们可以通过在 .babelrc 中进行配置来达到相同的目的:
{
"presets": ["es2015", "stage-1", "react"],
"plugins": [
["transform-react-jsx", {
"pragma": "createElement"
}]
]
}