반응에서 포털은 무엇을 의미합니까?

React의 Portal은 상위 구성 요소 외부의 DOM 계층 구조에 있는 DOM 노드로 하위 노드를 렌더링하는 좋은 방법을 제공합니다. 구문은 [ReactDOM.createPortal(child, 컨테이너)]입니다.

포털은 상위 구성 요소 외부의 DOM 계층 구조에 있는 DOM 노드로 하위 노드를 렌더링하는 좋은 방법을 제공합니다. Portals 提供了一种很好的将子节点渲染到父组件外部 DOM 层级中的 DOM 节点中的方式。

语法：

ReactDOM.createPortal(child, container)

第一个参数（child）是任意可渲染的 React 子元素，例如一个元素，字符串或片断。第二个参数（container）是一个 DOM 元素。

通常从组件的 render 方法中返回的一个元素，该元素仅能装配到 DOM 节点中离其最近的父元素，但有时候也需要将其插入到 DOM 节点中的不同位置：

render() {
  // React 不会创建新的 div。他渲染子元素到 `domNode` 中。
  // `domNode` 可以是任意有效的 DOM 节点，无论他在 DOM 中的位置如何。
  return ReactDOM.createPortal(
    this.props.children,
    domNode,
  );
}

对于 portal 的一个典型用例是当父组件有 overflow: hidden 或 z-index

구문: ​​

rrreee

첫 번째 매개변수(하위)는 요소, 문자열 또는 조각과 같은 렌더링 가능한 React 하위 요소입니다. 두 번째 매개변수(컨테이너)는 DOM 요소입니다. 일반적으로 구성 요소의 렌더링 메서드에서 반환된 요소는 DOM 노드에서 가장 가까운 상위 요소에만 어셈블될 수 있지만 때로는 DOM 노드의 다른 위치에 삽입해야 하는 경우도 있습니다.

rrreee

For 포털의 일반적인 사용 사례는 상위 구성 요소에 overflow:hidden 또는 z-index 스타일이 있고 컨테이너에서 시각적으로 점프하기 위해 하위 구성 요소가 필요한 경우입니다. 예를 들어 대화 상자, hovercard 및 도구 설명이 있습니다. 🎜🎜🎜관련 무료 학습 권장 사항: 🎜JavaScript🎜(동영상) 🎜🎜

위 내용은 반응에서 포털은 무엇을 의미합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!