antd modal怎么获取dom元素

componentDidMount() {

consolelog('22',ReactDOMfindDOMNode(thisrefsmode))

consolelog('22',ReactDOMfindDOMNode(thisrefsmode1))

}

<Modal title="Basic Modal" visible={true} ref="modal"

onOk={thisdel} onCancel={thisdel}

><div ref="modal1">

<p >some contents</p>

<p>some contents</p>

<p>some contents</p>

</div>

</Modal>

只能选到 modal1 选不到modal

不懂你获取dom元素 是那部分，如果是内部的可以，如查是 modal 框架的就不可以

在react中，我们已经知道，组件并不是真实的DOM节点，而是通过虚拟DOM渲染出来的节点，只有当它被插入到文档后，才成为了真实的DOM。

要从组件中获取真实的DOM节点，则可在jsx标签中加入ref属性

<script type="text/babel">

var Hello=ReactcreateClass({

showThis:function(){

//通过thisrefsusername拿取到了ref为username的元素节点

consolelog(thisrefsusernamevalue)

},

render:function(){

return (

<div>

<input type="text" ref="username" onChange={thisshowThis}/>

</div>

)

}

});

ReactDOMrender(

<Hello />,

documentgetElementById("box")

)

</script>

在以往的工作当中，通常会遇到需要处理 DOM 的时候， DOM *** 作属于一个常规的范畴，我们可能需要通过它绑定一个事件、调整滚动条的位置、管理焦点、文本选择、媒体播放等等。

基于工程页面、逻辑复杂性、复用性等等因素可以选择合适的方案方便我们 *** 作 DOM 。

在页面比较简单和逻辑并不复杂的时候，我们可以根据实际情况选择比较简单的选择器方案；当工程逻辑较复杂的时候，我们要考虑组件的复用性、多人协作的不可控性等多种因素，选择方案的时候往往要考虑更多可能的场景。

如上所述，如果我们的使用场景单一，不需要复用的话，我们可以保证获取的 DOM 一致性的时候，可以考虑使用选择器获取 DOM 。

可以使用 documentgetElementXX 开头的方法：

可使用方法如下：

实际使用场景：

页面逻辑复杂的时候会有复用性的问题，如果使用 id 或者选择器就容易引发问题，这时我们可以选择使用 ref 。

ref 可以获取到相应的 DOM 节点，而且也可以得到详细信息，它得到的一个对象，包括 props，state 等。

React 会在组件挂载时给 current 属性传入 DOM 元素，并在组件卸载时传入 null 值。 ref 会在 componentDidMount 或 componentDidUpdate 生命周期钩子触发前更新。

ref 的值根据节点的类型而有所不同：

React 也支持另一种设置 refs 的方式，称为“回调 refs”。

不同于传递 createRef() 创建的 ref 属性，你会传递一个函数。这个函数中接受 React 组件实例或 HTML DOM 元素作为参数，以使它们能在其他地方被存储和访问。

React 将在组件挂载时，会调用 ref 回调函数并传入 DOM 元素，当卸载时调用它并传入 null。在 componentDidMount 或 componentDidUpdate 触发前，React 会保证 refs 一定是最新的。

父组件想要 *** 作子组件且没有控制权的时候可以选择使用 findDOMNode 。

findDOMNode 只在已挂载的组件上可用（即：已经存在 DOM 中的组件）。如果尝试调用未挂载的组件将会引发异常。

findDOMNode 不能用于函数组件。

如果组件已经被挂载到 DOM 上，此方法会返回浏览器中相应的原生 DOM 元素。此方法对于从 DOM 中读取值很有用，例如获取表单字段的值或者执行 DOM 检测。

当组件渲染的内容为 null 或 false 时，findDOMNode 也会返回 null。当组件渲染的是字符串时，findDOMNode 返回的是字符串对应的 DOM 节点。从 React 16 开始，组件可能会返回有多个子节点的 fragment，在这种情况下，findDOMNode 会返回第一个非空子节点对应的 DOM 节点。

以上就是关于antd modal怎么获取dom元素全部的内容，包括:antd modal怎么获取dom元素、在react中，怎样获取dom元素、React 中 *** 作 DOM 的方法等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！