当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript react-fiber-export.IRenderer类代码示例

本文整理汇总了TypeScript中react-fiber-export.IRenderer的典型用法代码示例。如果您正苦于以下问题:TypeScript IRenderer类的具体用法?TypeScript IRenderer怎么用?TypeScript IRenderer使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。


在下文中一共展示了IRenderer类的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: renderSubtreeIntoContainer

function renderSubtreeIntoContainer(reconciler: IRenderer,
                                    contextSymbol: symbol,
                                    rootContainerSymbol: symbol,
                                    parentComponent: React.Component<any, any> | null,
                                    children: any,
                                    container: any,
                                    forceHydrate: boolean,
                                    callback: () => void) {
  if (forceHydrate) {
    throw new Error("forceHydrate not implemented yet");
  }

  let root = container[rootContainerSymbol];

  if (!root) {
    const newRoot = reconciler.createContainer(container);

    container[rootContainerSymbol] = newRoot;

    const renderActionsForContainer: RenderAction[] = [];

    if (container[contextSymbol] === undefined) {
      // noinspection UnnecessaryLocalVariableJS
      const rootContext: IHostContext = {
        triggerRender() {
          // console.log("render triggered for", renderActionsForContainer);

          renderActionsForContainer.forEach((action: RenderAction) => {
            action.triggerRender();
          });
        },
        renderActionFound(action: RenderAction) {
          // console.log("render action found", action);
          renderActionsForContainer.push(action);
        },
      };

      container[contextSymbol] = rootContext;
    }

    root = newRoot;

    reconciler.unbatchedUpdates(() => {
      reconciler.updateContainer(children, newRoot, parentComponent, callback);
    });
  } else {
    reconciler.updateContainer(children, root, parentComponent, callback);
  }

  return reconciler.getPublicRootInstance(root);
}
开发者ID:sychuginaanna,项目名称:react-three-renderer-fiber,代码行数:51,代码来源:customReactRenderer.ts

示例2: findHostObject

  public findHostObject(componentOrElement: any) {
    if (componentOrElement == null) {
      return null;
    }

    if (componentOrElement[this.reconcilerConfig.getFiberSymbol()] !== undefined) {
      // must be a host instance already then
      return componentOrElement;
    }

    const fiber: IFiber = componentOrElement._reactInternalFiber;
    if ((fiber != null)) {
      return this.reconciler.findHostInstance(fiber);
    }

    if (typeof componentOrElement.render === "function") {
      throw new Error("Unable to find node on an unmounted component.");
    } else {
      throw new Error("Element appears to be" +
        " neither ReactComponent nor DOMNode. Keys: %s" + Object.keys(componentOrElement));
    }
  }
开发者ID:sychuginaanna,项目名称:react-three-renderer-fiber,代码行数:22,代码来源:customReactRenderer.ts

示例3: unmountComponentAtNode

  public unmountComponentAtNode(container: any, callback?: () => void): any {
    if (container[this.reconcilerConfig.getRootContainerSymbol()]) {
      // if (__DEV__) {
      //   const rootEl = getReactRootElementInContainer(container);
      //   const renderedByDifferentReact =
      //     rootEl && !ReactDOMComponentTree.getInstanceFromNode(rootEl);
      //   warning(
      //     !renderedByDifferentReact,
      //     "unmountComponentAtNode(): The node you're attempting to unmount " +
      //     'was rendered by another copy of React.',
      //   );
      // }

      // Unmount should not be batched.
      this.reconciler.unbatchedUpdates(() => {
        renderSubtreeIntoContainer(this.reconciler,
          this.reconcilerConfig.getContextSymbol(),
          this.reconcilerConfig.getRootContainerSymbol(),
          null,
          null,
          container,
          false,
          () => {
            delete container[this.reconcilerConfig.getRootContainerSymbol()];

            if (callback != null) {
              callback();
            }
          });
      });
      // If you call unmountComponentAtNode twice in quick succession, you'll
      // get `true` twice. That's probably fine?
      return true;
    } else {
      if (callback != null) {
        callback();
      }
      // if (__DEV__) {
      //   const rootEl = getReactRootElementInContainer(container);
      //   const hasNonRootReactChild = !!(rootEl &&
      //     ReactDOMComponentTree.getInstanceFromNode(rootEl));
      //
      //   // Check if the container itself is a React root node.
      //   const isContainerReactRoot =
      //     container.nodeType === 1 &&
      //     isValidContainer(container.parentNode) &&
      //     !!container.parentNode._reactRootContainer;
      //
      //   warning(
      //     !hasNonRootReactChild,
      //     "unmountComponentAtNode(): The node you're attempting to unmount " +
      //     'was rendered by React and is not a top-level container. %s',
      //     isContainerReactRoot
      //       ? 'You may have accidentally passed in a React root node instead ' +
      //       'of its container.'
      //       : 'Instead, have the parent component update its state and ' +
      //       'rerender in order to remove this component.',
      //   );
      // }

      return false;
    }
  }
开发者ID:sychuginaanna,项目名称:react-three-renderer-fiber,代码行数:63,代码来源:customReactRenderer.ts

示例4:

 reconciler.unbatchedUpdates(() => {
   reconciler.updateContainer(children, newRoot, parentComponent, callback);
 });
开发者ID:sychuginaanna,项目名称:react-three-renderer-fiber,代码行数:3,代码来源:customReactRenderer.ts


注:本文中的react-fiber-export.IRenderer类示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。