在我的应用程序中有一个可组合的名为useLocalization
的程序。它提供基于用户语言首选项的翻译字符串,并在整个应用程序中使用。
问题是,可以配置useLocalization
并接受以下参数,但我不知道将这些参数从根组件传递到可组合的最佳方式是什么:
interface ILocalizationProps {
currentLocale: Ref<string>
fallbackLocale: Ref<string>
locales: Ref<Partial<ILocale>[]>
}
使用useLocalization
的根组件接受与props
相同的参数,因此消费应用程序可以配置/重写所使用的语言。
const DEFAULT_LANG = 'en'
export const withLocalizationProps = () => ({
currentLocale: { type: String, default: null },
fallbackLocale: { type: String, default: DEFAULT_LANG },
locales: { type: Array as () => Partial<ILocale>[], default: () => [] },
})
如何使用传递给根组件的支持来初始化可组合的?以下是我发现的问题:
useLocalization(props)
在这里不起作用,因为组件树中没有更深层次的道具。provide/inject
,我可以在provide
部件中使用props
,并获得正确配置的inject
版本,但这阻止了我在根组件中使用useLocalization
,因为注入不可用。useLocalization(props?: IProps)
,我的根组件必须是第一个用道具调用此函数的组件。有什么最好的办法解决这个问题吗?不依赖于组件状态(如useMouse )的可组合性很好,但是(全局)可配置的可组合性导致了上述问题:(
发布于 2022-08-03 01:58:40
在这种情况下,与其使用道具,不如使用提供/注入。
这是推荐信。https://vuejs.org/guide/components/provide-inject.html
https://stackoverflow.com/questions/73121991
复制相似问题