tiny-vue $parent 以及 $children 相关逻辑重构以实现 React、Inula 适配

$parent 以及 $children 相关逻辑重构以实现 React、Inula 适配

Open xiejay97 opened this issue 1 year ago • 3 comments

What problem does this feature solve

以carousel组件为例，在 renderless 中，获取父、子实例是依据 Vue 组件结构实现，如 carousel-item 获取到 carousel 是通过 parent.$parent，这是由于 carousel-item 组件外层有一层适配层组件。这是无法迁移的React中的特性，我们应当通过条件获取准确的父、子实例

What does the proposed API look like

父实例

  function getParent(instance, fn) {
    let parent = instance
    while (parent && !fn(parent)) {
      parent = parent.$parent
    }
    return parent
  }

子实例

  function getChildren(instance, fn) {
    let children = instance
    while (children && children[0] && !fn(children[0])) {
      children = children.$children
    }
    return children
  }