JSX语法
JSX是一种允许在JavaScript中编写类XML语言的语法,它需要通过babel
编译器转换成标准的JS语言。
使用JSX语法的必要准备
凡是使用JSX的
.js
文件都需要声明<script type="text/babel">
。三个库
1 | <script src="vendor-js/react.js"></script> |
JSX的几个表现形式
HTML与JavaScript混写
HTML语言直接不带引号地写在JS语言中。如<h1>Hello world<\h1>
。
React组件可被使用
(约定都是大写)可以在被定义之后像普通的HTML标签一样<React-component />
被使用。
React的JSX约定:开头大写代表自定义本地组件,小写开头代表HTML标签。
JavaScript表达式
注意这里的JavaScript表达式可以是:
包括常量、关键字、变量的原始表达式
对象和数组的初始化表达式
函数定义表达式
基于运算符的算术表达式
作为结点属性值
在大花括号内放置任何有效的JavaScript表达式并进行为节点属性进行赋值操作,这里的结点既可以是HTML自带的标签,也可以是自定义的元素或组件。
attribute = {JavaScript-expression}
。
作为子节点表达式
在大花括号内放置任何有效的子节点表达式,两边用父节点包括起来。
1 | return( |
- 本文标题:JSX语法
- 本文作者:徐徐
- 创建时间:2020-10-06 19:33:47
- 本文链接:https://machacroissant.github.io/2020/10/06/jsx-syntax/
- 版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
评论