react学习笔记（一）

默认的react调用方式为　　render(要渲染的组件，要放到的节点)


　　const React={
   　　 createElement(tag,props,...children){
    　　    return {
      　　      tag,
      　　      props,
      　　      children
      　　  }
  　　  }
　　}

    //渲染分为两种渲染，一种是文本节点渲染，一种是标签节点渲染（）

　　const render=(vNode,container)=>{
　　　　//如果单纯传过来一个字符串
    　　if(typeof vNode=="string"){
　　　　　　
     　　   var fragment=document.createTextNode(vNode);
     　　   container.appendChild(fragment)

   　　 }else if (typeof vNode=="object") {
　　　　　　　　//如果传过来的是一个对象，那么就默认它是一个React对象，先模式解析后再操作
     　　   let {tag,props,children}=vNode;//模式解构如果参数不够用，左边不能再用...运算符，不够用的话会默认分配到最后一项去
     　　   console.log(children)
       　　 var wrapper=document.createElement(tag)
       　　　wrapper.setAttribute("class",props)

      　　  //遍历所有子项
      　　  for(var i of children){
       　　     render(i,wrapper)//递归函数
          
      　　  }
      　　  container.appendChild(wrapper)
   　　 }

　　}
　　var div=React.createElement("div","wrapper", React.createElement("span", null, "zuimei"),"fjsdjf")
　　render(div,window.root)