- 博客(2)
- 收藏
- 关注
原创 react的jsx的渲染原理
转化成React.createElement函数 而这个函数 会创建一个对应的element ,element会形成一个元素树 每一个元素树是一个对象 就是虚拟DOM。这里提一张嘴,生成的是虚拟DOM, React渲染页面的机制都是从虚拟dom的根节点开始深度优先的比对的。把右边经过编译的代码替换到原jsx中网页也能运行 这也说明了 内部就是这么转换的。这里载babel的在线编译中执行一下。大致流程就是(先看红色再看绿色)jsx代码会被babel。
2023-09-28 10:54:03
38
原创 react里jsx的事件绑定的this指向问题
浏览器无法直接识别jsx语法,执行jsx时被babel解析转译,而babel解析过的js代码会默认转化为严格模式。严格模式下最外层的函数默认调用本指向window的this会变成undefind。元素的点击事件触发执行箭头函数箭头函数的指向为这个组件的实例对象箭头函数又调用了我们需要的函数 普通函数就是谁先用this就指向谁这时候函数的this也指向了这个组件的实例对象。上面的可能有点抽象 这里用js再解释一下。简单大致的解释一 点击事件的运行过程。所以这里推荐两种解决方法。1.就是直接绑定this。
2023-09-28 10:41:25
21
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人