React - JSX 的11条语法笔记

JSX 是专为 React 开发的一种语法糖,在 JS 的基础上扩展了书写 HTML 代码的能力。这里总结了11条语法知识。

  1. 在其中书写 html 格式内容时,注意变量控制和替换;

  2. 属性和属性名要求驼峰法;

  3. 先转义jsx值,再渲染dom;

  4. 编译时调用 React.createElement() 方法来转义jsx语法;

  5. 编辑器推荐使用 Babel 语法, 可以使 es6 和 jsx 语法高亮;

  6. 使用jsx语法必须引入react模块;

  7. 自定义组件须以大写字母开头

    当一个元素类型以小写字母开头,它表示引用一个类似于 <div> 或者 <span> 的内置组件,会给 React.createElement 方法传递 ‘div’ 或者 ‘span’ 字符串。以大写字母开头的类型,类似于 <Foo />,会被编译成 React.createElement(Foo) ,对应于自定义组件 或者在 JavaScript 文件中导入的组件。

  8. 动态选择组件时,可先将表达式赋值给一个大写开头的变量,再引用;

  9. props接受任意表达式,以大括号包裹,也可以是字符串字面量;

  10. children同props类似,也接受任意表达式(以大括号包裹)、字符串、组件, 但要注意空字符在编译时的消除;

    JSX会删除每行开头和结尾的空格,并且也会删除空行。邻接标签的空行也会被移除,字符串之间的空格会被压缩成一个空格

  11. false,null,undefined,和 true 都是有效的的 children(子元素) 。但是并不会被渲染。

展开阅读全文

Windows版YOLOv4目标检测实战:训练自己的数据集

04-26
©️2020 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值