TypeScript inferno-shared.combineFrom函數代碼示例

export default function Link(props, { router }): VNode {
  const {
    activeClassName,
    activeStyle,
    className,
    onClick,
    children,
    to,
    ...otherProps
  } = props;

  let classNm;
  if (className) {
    classNm = className as string;
  }

  if (!router) {
    if (process.env.NODE_ENV !== "production") {
      warning(
        "<Link/> component used outside of <Router/>. Fallback to <a> tag."
      );
    }

    otherProps.href = to;
    otherProps.onClick = onClick;

    return renderLink(classNm, children, otherProps);
  }

  otherProps.href = isBrowser
    ? router.createHref({ pathname: to })
    : router.location.baseUrl ? router.location.baseUrl + to : to;

  if (router.location.pathname === to) {
    if (activeClassName) {
      classNm = (className ? className + " " : "") + activeClassName;
    }
    if (activeStyle) {
      otherProps.style = combineFrom(props.style, activeStyle);
    }
  }

  otherProps.onclick = function navigate(e) {
    if (e.button !== 0 || e.ctrlKey || e.altKey || e.metaKey || e.shiftKey) {
      return;
    }
    e.preventDefault();
    if (typeof onClick === "function") {
      onClick(e);
    }
    router.push(to, e.target.textContent);
  };

  return renderLink(classNm, children, otherProps);
}

export function patchComponent(
  lastVNode,
  nextVNode,
  parentDom,
  lifecycle: LifecycleClass,
  context,
  isSVG: boolean,
  isClass: boolean,
  isRecycling: boolean
) {
  const lastType = lastVNode.type;
  const nextType = nextVNode.type;
  const lastKey = lastVNode.key;
  const nextKey = nextVNode.key;

  if (lastType !== nextType || lastKey !== nextKey) {
    replaceWithNewNode(
      lastVNode,
      nextVNode,
      parentDom,
      lifecycle,
      context,
      isSVG,
      isRecycling
    );
    return false;
  } else {
    const nextProps = nextVNode.props || EMPTY_OBJ;

    if (isClass) {
      const instance = lastVNode.children;
      instance._updating = true;

      if (instance._unmounted) {
        if (isNull(parentDom)) {
          return true;
        }
        replaceChild(
          parentDom,
          mountComponent(
            nextVNode,
            null,
            lifecycle,
            context,
            isSVG,
            (nextVNode.flags & VNodeFlags.ComponentClass) > 0
          ),
          lastVNode.dom
        );
      } else {
        const hasComponentDidUpdate = !isUndefined(instance.componentDidUpdate);
        const nextState = instance.state;
        // When component has componentDidUpdate hook, we need to clone lastState or will be modified by reference during update
        const lastState = hasComponentDidUpdate
          ? combineFrom(nextState, null)
          : nextState;
        const lastProps = instance.props;
        nextVNode.children = instance;
        instance._isSVG = isSVG;
        const lastInput = instance._lastInput;
        let nextInput = instance._updateComponent(
          lastState,
          nextState,
          lastProps,
          nextProps,
          context,
          false,
          false
        );
        // If this component was destroyed by its parent do nothing, this is no-op
        // It can happen by using external callback etc during render / update
        if (instance._unmounted) {
          return false;
        }
        let didUpdate = true;
        // Update component before getting child context
        let childContext;
        if (!isNullOrUndef(instance.getChildContext)) {
          childContext = instance.getChildContext();
        }
        if (isNullOrUndef(childContext)) {
          childContext = context;
        } else {
          childContext = combineFrom(context, childContext);
        }

        instance._childContext = childContext;
        if (isInvalid(nextInput)) {
          nextInput = createVoidVNode();
        } else if (nextInput === NO_OP) {
          nextInput = lastInput;
          didUpdate = false;
        } else if (isStringOrNumber(nextInput)) {
          nextInput = createTextVNode(nextInput, null);
        } else if (isArray(nextInput)) {
          if (process.env.NODE_ENV !== "production") {
            throwError(
              "a valid Inferno VNode (or null) must be returned from a component render. You may have returned an array or an invalid object."
            );
          }
//.........這裏部分代碼省略.........

function renderVNodeToString(
  vNode,
  parent,
  context,
  firstChild
): string | undefined {
  const flags = vNode.flags;
  const type = vNode.type;
  const props = vNode.props || EMPTY_OBJ;
  const children = vNode.children;

  if ((flags & VNodeFlags.Component) > 0) {
    const isClass = flags & VNodeFlags.ComponentClass;

    if (isClass) {
      const instance = new type(props, context);
      instance._blockSetState = false;
      let childContext;
      if (isFunction(instance.getChildContext)) {
        childContext = instance.getChildContext();
      }

      if (isNullOrUndef(childContext)) {
        childContext = context;
      } else {
        childContext = combineFrom(context, childContext);
      }
      if (instance.props === EMPTY_OBJ) {
        instance.props = props;
      }
      instance.context = context;
      instance._unmounted = false;
      if (isFunction(instance.componentWillMount)) {
        instance._blockRender = true;
        instance.componentWillMount();
        if (instance._pendingSetState) {
          const state = instance.state;
          const pending = instance._pendingState;

          if (state === null) {
            instance.state = pending;
          } else {
            for (const key in pending) {
              state[key] = pending[key];
            }
          }
          instance._pendingSetState = false;
          instance._pendingState = null;
        }
        instance._blockRender = false;
      }
      const nextVNode = instance.render(props, instance.state, instance.context);
      // In case render returns invalid stuff
      if (isInvalid(nextVNode)) {
        return "<!--!-->";
      }
      return renderVNodeToString(nextVNode, vNode, childContext, true);
    } else {
      const nextVNode = type(props, context);

      if (isInvalid(nextVNode)) {
        return "<!--!-->";
      }
      return renderVNodeToString(nextVNode, vNode, context, true);
    }
  } else if ((flags & VNodeFlags.Element) > 0) {
    let renderedString = `<${type}`;
    let html;
    const isVoidElement = voidElements.has(type);
    const className = vNode.className;

    if (isString(className)) {
      renderedString += ` class="${escapeText(className)}"`;
    } else if (isNumber(className)) {
      renderedString += ` class="${className}"`;
    }

    if (!isNull(props)) {
      for (const prop in props) {
        const value = props[prop];

        if (prop === "dangerouslySetInnerHTML") {
          html = value.__html;
        } else if (prop === "style") {
          renderedString += ` style="${renderStylesToString(props.style)}"`;
        } else if (prop === "children") {
          // Ignore children as prop.
        } else if (prop === "defaultValue") {
          // Use default values if normal values are not present
          if (!props.value) {
            renderedString += ` value="${isString(value)
              ? escapeText(value)
              : value}"`;
          }
        } else if (prop === "defaultChecked") {
          // Use default values if normal values are not present
          if (!props.checked) {
            renderedString += ` checked="${value}"`;
          }
        } else {
//.........這裏部分代碼省略.........

export function createClassComponentInstance(
  vNode: VNode,
  Component,
  props: Props,
  context: Object,
  isSVG: boolean,
  lifecycle: LifecycleClass
) {
  if (isUndefined(context)) {
    context = EMPTY_OBJ; // Context should not be mutable
  }
  const instance = new Component(props, context);
  vNode.children = instance;
  instance._blockSetState = false;
  instance.context = context;
  if (instance.props === EMPTY_OBJ) {
    instance.props = props;
  }
  // setState callbacks must fire after render is done when called from componentWillReceiveProps or componentWillMount
  instance._lifecycle = lifecycle;

  instance._unmounted = false;
  instance._isSVG = isSVG;
  if (!isNullOrUndef(instance.componentWillMount)) {
    instance._blockRender = true;
    instance.componentWillMount();

    if (instance._pendingSetState) {
      const state = instance.state;
      const pending = instance._pendingState;

      if (state === null) {
        instance.state = pending;
      } else {
        for (const key in pending) {
          state[key] = pending[key];
        }
      }
      instance._pendingSetState = false;
      instance._pendingState = null;
    }

    instance._blockRender = false;
  }

  let childContext;
  if (!isNullOrUndef(instance.getChildContext)) {
    childContext = instance.getChildContext();
  }

  if (isNullOrUndef(childContext)) {
    instance._childContext = context;
  } else {
    instance._childContext = combineFrom(context, childContext);
  }

  if (!isNull(options.beforeRender)) {
    options.beforeRender(instance);
  }

  let input = instance.render(props, instance.state, context);

  if (!isNull(options.afterRender)) {
    options.afterRender(instance);
  }
  if (isArray(input)) {
    if (process.env.NODE_ENV !== "production") {
      throwError(
        "a valid Inferno VNode (or null) must be returned from a component render. You may have returned an array or an invalid object."
      );
    }
    throwError();
  } else if (isInvalid(input)) {
    input = createVoidVNode();
  } else if (isStringOrNumber(input)) {
    input = createTextVNode(input, null);
  } else {
    if (input.dom) {
      input = directClone(input);
    }
    if (input.flags & VNodeFlags.Component) {
      // if we have an input that is also a component, we run into a tricky situation
      // where the root vNode needs to always have the correct DOM entry
      // so we break monomorphism on our input and supply it our vNode as parentVNode
      // we can optimise this in the future, but this gets us out of a lot of issues
      input.parentVNode = vNode;
    }
  }
  instance._lastInput = input;
  return instance;
}

export function cloneVNode(
  vNodeToClone: VNode,
  props?: Props,
  ..._children: InfernoChildren[]
): VNode {
  let children: any = _children;
  const childrenLen = _children.length;

  if (childrenLen > 0 && !isUndefined(_children[0])) {
    if (!props) {
      props = {};
    }
    if (childrenLen === 1) {
      children = _children[0];
    }

    if (!isUndefined(children)) {
      props.children = children as VNode;
    }
  }

  let newVNode;

  if (isArray(vNodeToClone)) {
    const tmpArray: InfernoChildren = [];
    for (let i = 0, len = (vNodeToClone as any).length; i < len; i++) {
      tmpArray.push(directClone(vNodeToClone[i]));
    }

    newVNode = tmpArray;
  } else {
    const flags = vNodeToClone.flags;
    let className = vNodeToClone.className;
    let key = vNodeToClone.key;
    let ref = vNodeToClone.ref;
    if (props) {
      if (props.hasOwnProperty("className")) {
        className = props.className as string;
      }
      if (props.hasOwnProperty("ref")) {
        ref = props.ref as Ref;
      }

      if (props.hasOwnProperty("key")) {
        key = props.key;
      }
    }

    if (flags & VNodeFlags.Component) {
      newVNode = createVNode(
        flags,
        vNodeToClone.type,
        className,
        null,
        !vNodeToClone.props && !props
          ? EMPTY_OBJ
          : combineFrom(vNodeToClone.props, props),
        key,
        ref,
        true
      );
      const newProps = newVNode.props;

      if (newProps) {
        const newChildren = newProps.children;
        // we need to also clone component children that are in props
        // as the children may also have been hoisted
        if (newChildren) {
          if (isArray(newChildren)) {
            const len = newChildren.length;
            if (len > 0) {
              const tmpArray: InfernoChildren = [];

              for (let i = 0; i < len; i++) {
                const child = newChildren[i];

                if (isStringOrNumber(child)) {
                  tmpArray.push(child);
                } else if (!isInvalid(child) && isVNode(child)) {
                  tmpArray.push(directClone(child));
                }
              }
              newProps.children = tmpArray;
            }
          } else if (isVNode(newChildren)) {
            newProps.children = directClone(newChildren);
          }
        }
      }
      newVNode.children = null;
    } else if (flags & VNodeFlags.Element) {
      children =
        props && !isUndefined(props.children)
          ? props.children
          : vNodeToClone.children;
      newVNode = createVNode(
        flags,
        vNodeToClone.type,
        className,
        children,
//.........這裏部分代碼省略.........

/**
 * Go through every route and create a new node
 * with the matched components
 * @param _routes
 * @param currentURL
 * @param parentPath
 * @param redirect
 * @returns {object}
 */
function matchRoutes(
  _routes,
  currentURL = "/",
  parentPath = "/",
  redirect = false
) {
  const routes = isArray(_routes) ? flatten(_routes) : toArray(_routes);
  const [pathToMatch = "/", search = ""] = currentURL.split("?");
  const params = mapSearchParams(search);

  routes.sort(pathRankSort);

  for (let i = 0, len = routes.length; i < len; i++) {
    const route = routes[i];
    const props = route.props || emptyObject;
    const routePath = props.from || props.path || "/";
    const location =
      parentPath + toPartialURL(routePath, parentPath).replace(/\/\//g, "/");
    const isLast = isEmpty(props.children);
    const matchBase = matchPath(isLast, location, pathToMatch);

    if (matchBase) {
      let children = props.children;

      if (props.from) {
        redirect = props.to;
      }
      if (children) {
        const matchChild = matchRoutes(
          children,
          currentURL,
          location,
          redirect
        );
        if (matchChild) {
          if (matchChild.redirect) {
            return {
              location,
              redirect: matchChild.redirect
            };
          }
          children = matchChild.matched;
          const childProps = children.props.params;
          for (const key in childProps) {
            params[key] = childProps[key];
          }
        } else {
          children = null;
        }
      }

      const matched = Inferno.cloneVNode(route, {
        children,
        params: combineFrom(params, matchBase.params)
      });

      return {
        location,
        matched,
        redirect
      };
    }
  }
}