在定义React组件或者书写React相关代码,不管代码中有没有用到React这个对象,我们都必须将其import进来,这是为什么?
笔者最近在看React源码解析,才知其缘由,因为将JSX片段编译并返回JS对象也就是虚拟Dom,需要用到React.createElement()方法,需要导入React
关于createElement方法是什么?用来干嘛的?笔者最近准备手撸一个简易版的React,实现React的核心功能。起初实现最基础功能jsx和虚拟Dom,需要用 babel-plugin-transform-react-jsx的babel插件解析jsx语法,在配置.babelrc中有pragma项,可以自定义转换方法,React定义的是createElement方法,
当然我们写类框架可以自定义任意方法,createElement()方法接收三个参数:
第一个参数是Dom节点标签,比如div、span、h1等等;
第二个参数是一个对象,里面包含了所有的属性,可能包含了className
,id
等等;
第三个参数为一个数组,使用扩展运算符将子节点child1,child2合并的一个数组children;
该方法返回一个JS对象,该JS对象记录了该Dom节点的所有信息,就是虚拟Dom。