Creation:2025-02-07Last update:2025-06-29
将此文档参考到您的 AI 助手ChatGPTClaudeDeepSeekGoogle AI modeGeminiPerplexityMistralGrok
使用您最喜欢的AI助手总结文档，并引用此页面和AI提供商
此页面的内容已使用 AI 翻译。
查看英文原文的最新版本编辑此文档
如果您有改善此文档的想法，请随时通过在GitHub上提交拉取请求来贡献。
文档的 GitHub 链接Copy
复制文档 Markdown 到剪贴板
嵌套 / 子内容引用
嵌套如何工作
在 Intlayer 中，嵌套是通过 nest 函数实现的，它允许您引用和重用来自另一个字典的内容。与其重复内容，不如通过其键指向现有的内容模块。
设置嵌套
要在您的 Intlayer 项目中设置嵌套，您首先需要定义您希望重用的基础内容。然后，在一个单独的内容模块中，使用 nest 函数导入该内容。
基础字典
以下是一个基础字典的示例，用于在另一个字典中嵌套：
firstDictionary.content.ts
复制代码
复制代码到剪贴板
import { type Dictionary } from "intlayer";
const firstDictionary = {
key: "key_of_my_first_dictionary",
content: {
content: "content",
subContent: {
contentNumber: 0,
contentString: "string",
},
},
} satisfies Dictionary;
export default firstDictionary;使用 Nest 引用
现在，创建另一个内容模块，使用 nest 函数引用上述内容。您可以引用整个内容或特定的嵌套值：
secondDictionary.content.ts
复制代码
复制代码到剪贴板
import { nest, type Dictionary } from "intlayer";
const myNestingContent = {
key: "key_of_my_second_dictionary",
content: {
// 引用整个字典：
fullNestedContent: nest("key_of_my_first_dictionary"),
// 引用特定的嵌套值：
partialNestedContent: nest(
"key_of_my_first_dictionary",
"subContent.contentNumber"
),
},
} satisfies Dictionary;
export default myNestingContent;作为第二个参数，您可以指定该内容中嵌套值的路径。如果未提供路径，则返回引用字典的整个内容。
在 React Intlayer 中使用嵌套
要在 React 组件中使用嵌套内容，可以利用 react-intlayer 包中的 useIntlayer 钩子。此钩子根据指定的键检索正确的内容。以下是如何使用它的示例：
**/*.tsx
复制代码
复制代码到剪贴板
import type { FC } from "react";
import { useIntlayer } from "react-intlayer";
const NestComponent: FC = () => {
const { fullNestedContent, partialNestedContent } = useIntlayer(
"key_of_my_second_dictionary"
);
return (
<div>
<p>
Full Nested Content: {JSON.stringify(fullNestedContent)}
{/* 输出: {"content": "content", "subContent": {"contentNumber": 0, "contentString": "string"}} */}
</p>
<p>
Partial Nested Value: {partialNestedContent}
{/* 输出: 0 */}
</p>
</div>
);
};
export default NestComponent;其他资源
有关配置和使用的更多详细信息，请参考以下资源：
这些资源提供了在不同环境和各种框架中设置和使用 Intlayer 的更多见解。