Vuejs从父提供者组件

Question

我试图从父“ThemeProvider”组件注入vue中的功能组件，但功能组件没有获得提供的主题对象。

仅当提供程序位于View.vue文件中时才有效...有没有办法做“父提供”＆gt; “孩子注射”或是“祖先提供”＆gt; “孩子注射”唯一的方法？

ThemeProvider.vue

export default {
  name: 'ThemeProvider',

  provide: {
    theme: {
      dark: '#222'
    }
  },

  render (h) {
    return h('div', this.$slots.default)
  }
}

FunctionComponent.vue

 export default {
    functional: true,

    inject: {
      theme: {
        default: () => ({})
      }
    },

    render: (h, { injections, children }) => {
      console.log(injections.theme.dark) // dont exist
      return h('div', children)
    }
  }

View.vue

<template>
 <ThemeProvider>
  <FunctionalComponent />
 </ThemeProvider>
</template>