# vue: msg
URL: https://generaltranslation.com/zh/docs/vue/reference/functions/msg.mdx
---

title: msg
description: 在模块作用域中注册静态字符串，以便后续解析。msg 的 API 参考。

---

`msg` 会标记源字符串以供提取，但不会读取区域设置状态或对其进行翻译。在组件内使用 [`useMessages()`](/docs/vue/reference/composables/use-messages) 解析已注册的值。

## 概览 [#overview]

```ts
function msg<T extends string | readonly string[]>(message: T): T;
function msg<T extends string | readonly string[]>(
  message: T,
  options?: GTStringOptions
): T extends string ? string : string[];
```

在模块作用域内声明已注册的字符串：

```ts title="src/messages.ts"
import { msg } from 'gt-vue';

export const saved = msg('Your preferences are saved.', {
  $context: 'status message',
});
```

该调用可安全地用于客户端和服务器端模块，因为它不依赖 plugin 或浏览器全局运行时环境。

## 参数 [#parameters]

| 参数        | 描述                      | 类型                                                               | 可选 | 默认值 |
| --------- | ----------------------- | ---------------------------------------------------------------- | -- | --- |
| `message` | 静态源字符串，或由静态源字符串构成的只读数组。 | `string \| readonly string[]`                                    | 否  | —   |
| `options` | 与每个源字符串一同编码的上下文。        | [`GTStringOptions`](/docs/vue/reference/types/gt-string-options) | 是  | 无   |

`$context` 是唯一支持的选项。每次调用及数组中的每个条目都必须能由 CLI 在静态分析时发现。

## 工作原理 [#how-it-works]

不传入 `options` 时，`msg` 会原样返回原始字符串或数组。提取器仍会注册静态调用，而 [`useMessages()`](/docs/vue/reference/composables/use-messages) 可以解析返回的源字符串。

传入选项对象时，`msg` 会计算纯 `STRING` 哈希值，并附加包含源文本和 `$context` 的不透明元数据。[`useMessages()`](/docs/vue/reference/composables/use-messages) 会解码此元数据，其优先级高于在解析处传入的选项。

对于带选项的数组，每个条目都会独立编码，并返回新的 `string[]`。`msg` 不执行目录查找、插值或 ICU 处理。花括号会保留为字面文本。

## 返回值 [#returns]

| 输入       | 返回类型       | 行为                |
| -------- | ---------- | ----------------- |
| 不带选项的字符串 | 推断出的输入类型   | 返回原始源字符串。         |
| 不带选项的数组  | 推断出的输入类型   | 返回同一只读数组。         |
| 带选项的字符串  | `string`   | 返回源字符串及不透明的查找元数据。 |
| 带选项的数组   | `string[]` | 返回由编码后的字符串组成的新数组。 |

请勿直接渲染编码后的值。请将其传递给 [`useMessages()`](/docs/vue/reference/composables/use-messages) 返回的 [`MessagesFunction`](/docs/vue/reference/types/messages-function)。

## 示例 [#examples]

在 Vue 模板中解析已注册的消息：

```vue title="src/StatusMessage.vue"
<script setup lang="ts">
import { msg, useMessages } from 'gt-vue';

const saved = msg('Your preferences are saved.', {
  $context: 'status message',
});
const m = useMessages();
</script>

<template>
  <p>{{ m(saved) }}</p>
</template>
```

同时注册多条独立消息：

```ts
const labels = msg(['Save', 'Cancel', 'Delete'] as const);
```

这两种情况都不会进行插值。对于富内容中的运行时值，请使用 [`<T>`](/docs/vue/reference/components/t) 和 [`<Var>`](/docs/vue/reference/components/var)。