欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

程序员文章站 2022-03-18 16:43:34
今天心血来潮,打开了sublime想玩玩react,然后大家都知道的先引入一大串 就是在百度静态资源库里找到的。 然后贴html代码 对的,没错,就这么一行,毕竟只是测试嘛 然后js代码 大家一定要注意,在script的开头标签里,一定要注明,否则浏览器会报错,解析不了。 就按照这样的代码,照理来说 ......

今天心血来潮,打开了sublime想玩玩react,然后大家都知道的先引入一大串

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

就是在百度静态资源库里找到的。

然后贴html代码

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

对的,没错,就这么一行,毕竟只是测试嘛

然后js代码

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

大家一定要注意,在script的开头标签里,一定要注明react随笔-1(为什么在react使用jq无法正确渲染组件位置),否则浏览器会报错,解析不了。

就按照这样的代码,照理来说应该没问题吧。

但是不知道为什么,浏览器就是出不来这样的效果。并且还给我报这样的错误

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

找了半天才发现,在react中的ReactDOM.render()方法中有两个参数,第一个是要渲染的组件,第二个必须要JS的原生对象。而我代码中使用的是jQ的对象,那怎么解决呢?

很简单  把代码由react随笔-1(为什么在react使用jq无法正确渲染组件位置)

改为react随笔-1(为什么在react使用jq无法正确渲染组件位置)

或者使用$(".mydiv").get(0)将其转换为原生js对象,就ok啦!

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

react随笔-1(为什么在react使用jq无法正确渲染组件位置)

诶这个bug找了很久,很尴尬,以后要注意啦!