react-dom是什么

react-dom是react开发项目时需要使用的工具包,是一种针对dom的平台实现,主要用于在web端进行渲染。react-dom包提供了DOM特定的方法,可以在应用程序的顶层使用,也可以作为React模型之外的特殊操作DOM的接口。

react-dom是什么

使用react开发网页的话,我们难免会下载两个包,一个是react,一个是react-dom,其中react是react的核心代码。

react-dom 的 package 提供了可在应用顶层使用的 DOM(DOM-specific)方法,react-dom 包提供了 DOM 特定的方法,可以在你的应用程序的顶层使用,如果有需要,你可以把这些方法用于 React 模型以外的地方,作为 React模型 之外的特殊操作DOM的接口。不过一般情况下,大部分组件都不需要使用这个模块。

如果你使用 npm 和 ES6,你可以用 import ReactDOM from ‘react-dom’进行引入。如果你使用 npm 和 ES5,你可以用 var ReactDOM = require(‘react-dom’)进行引入。

react-dom的五个接口

1、render()

ReactDOM.render(element, container[, callback])

登录后复制

在提供的 container 里渲染一个 React 元素,并返回对该组件的引用(或者针对无状态组件返回 null)。

如果 React 元素之前已经在 container 里渲染过,这将会对其执行更新操作,并仅会在必要时改变 DOM 以映射最新的 React 元素。

如果提供了可选的回调函数,该回调将在组件被渲染或更新之后被执行。

2、hydrate()

ReactDOM.render(element, container[, callback])// 渲染一个 React 元素到由 container 提供的 DOM 中,并且返回组件的一个 引用(reference) (或者对于 无状态组件 返回 null )

登录后复制

3、unmountComponentAtNode()

ReactDOM.unmountComponentAtNode(container)// 从 DOM 中移除已装载的 React 组件,并清除其事件处理程序和 state 。 如果在容器中没有挂载组件,调用此函数什么也不做。 如果组件被卸载,则返回 true ,如果没有要卸载的组件,则返回 false

登录后复制

4、findDOMNode() 不建议使用

ReactDOM.findDOMNode(component)// 如果组件已经被装载到 DOM 中,这将返回相应的原生浏览器 DOM 元素。在大多数情况下,你可以绑定一个 ref 到 DOM 节点上,从而避免使用findDOMNode。

登录后复制

5、createPortal() 这个很有用处,啊啊啊!

ReactDOM.createPortal(child, container)// 创建一个 插槽(portal) 。 插槽提供了一种方法,可以将子元素渲染到 DOM 组件层次结构之外的 DOM 节点中

登录后复制

更多编程相关知识,请访问:编程入门!!

以上就是react-dom是什么的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2724416.html

(0)
上一篇 2025年3月7日 23:13:39
下一篇 2025年3月7日 23:13:49

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • React Developer Tools是什么?

    React Developer Tools是一款由facebook开发的Chrome浏览器扩展;通过它,可以在chrome开发者工具中得到一个名为React的新标签,检查React组件层次结构,在页面上显示React组件。 本 本文操作环境…

    2025年3月7日 编程技术
    200
  • React中props与state的区别是什么?

    区别:1、props是传递给组件的(类似于函数的形参),而state是在组件内部被组件自己管理的(类似于在一个函数内声明的变量);2、props是不可以被修改的,state是多变的,可被修改的。 (相关推荐:React视频教程) 开发rea…

    2025年3月7日
    200
  • react中dva干什么用的?

    dva是一个基于redux和redux-saga的一个轻型框架,能辅助更好的组织代码进行开发;同时内置了react-router和fetch,基本上具备了开发web前端应用所需的主要工具,简化了开发体验,可省下开发者自己进行配置安装的工作。…

    2025年3月7日
    200
  • react中怎么获取数据

    react中获取数据的方法:1、使用生命周期方法请求数据;2、使用Hooks获取数据;3、使用suspense获取数据。 本教程操作环境:windows10系统、react16,本文适用于所有品牌的电脑。 react中获取数据的方法: 1.…

    2025年3月7日
    200
  • 怎么用react

    react的使用:1、用于构建用户界面的JAVASCRIPT库;2、用于构建UI;3、用来架设Instagram的网站;4、拥有较高的性能,代码逻辑非常简单。 React React 是一个用于构建用户界面的 JAVASCRIPT 库。 R…

    2025年3月7日
    200
  • react怎么显示隐藏

    react显示隐藏的方法:1、通过state变量来控制是否渲染元素,类似vue中的【v-if】;2、通过style控制display属性,类似vue中的【v-show】;3、通过动态切换className。 本教程操作环境:windows1…

    2025年3月7日
    200
  • 跨react域问题怎么解决

    react跨域问题的解决方法:首先在【package.json】中加入【proxy”: “http://localhost:8000】;然后页面中的请求【fetch(‘/api/userdata/&#82…

    2025年3月7日
    200
  • 用react怎么实现收藏功能

    用react实现收藏功能的方法:通过设置iconStatus取反来实现点击收藏,代码为【const [icoStatus, setIcoStatus] = useState(true)】。 用react实现收藏功能的方法: 1、通过设置ic…

    2025年3月7日
    200
  • react中props和state的区别什么

    react中props和state的区别:1、props主要是用于组件之间传递参数,获取组件的属性值,对于外界组件的属性值,无法直接修改,它是只读的;2、state主要用于组件更新控制,如果想重新渲染或更新组件,只需要修改state即可。 …

    2025年3月7日
    200
  • react中portal是什么意思

    react中portal是提供了一种很好的将子节点渲染到父组件外部DOM层级中的DOM节点中的方式,语法为【ReactDOM.createPortal(child, container)】。 Portals 提供了一种很好的将子节点渲染到父…

    2025年3月7日
    200

发表回复

登录后才能评论