Fork me on GitThub

JSX

Babel的作用

把不是ES5的代码转换成ES5的代码,是一个JavaScript编译器。
代码在浏览器中运行之后会生成一个js对象,含有两个属性:typechildren。然后读取type属性值,通过DOM操作添加元素。
这个js对象就是传说中的virtual DOM

为什么要引入React

因为babel将JSX代码转换成js代码后,需要用到React。

JSX的使用

  • 将表达式放到花括号中;
  • 并列标签必须要被一个爸爸(div)包住,不想要爸爸的话,可以找一个假的爸爸:import导入Fragment,使用<Fragment><Fragment/>包住并列的孩子们;
  • 一个花括号代表着表达式;
  • 两个花括号才表示对象;
  • 行内样式要这样写:style = {{}}
  • 行内样式中,比如font-size要写成fontSize(即驼峰式);
  • 行内属性中class属性不能用,要用className。但是id还是可以照常使用的;
posted @ 2018-07-09 20:29  林檎endymion  阅读(110)  评论(0编辑  收藏  举报