docs: not use deprecated api (#2013)

* docs: not use deprecated api * fix: e2e * fix * fix
intlify · Nov 13, 2024 · 229cba8 · 229cba8
1 parent 73f9e88
commit 229cba8
Show file tree

Hide file tree

Showing 7 changed files with 64 additions and 65 deletions.
diff --git a/docs/.ja/guide/advanced/function.md b/docs/.ja/guide/advanced/function.md
@@ -188,12 +188,12 @@ const messages = {
 Template:
 
 ```html
-<p>{{ $tc('car', 1) }}</p>
-<p>{{ $tc('car', 2) }}</p>
+<p>{{ $t('car', 1) }}</p>
+<p>{{ $t('car', 2) }}</p>
 
-<p>{{ $tc('apple', 0) }}</p>
-<p>{{ $tc('apple', 1) }}</p>
-<p>{{ $tc('apple', 10, { count: 10 }) }}</p>
+<p>{{ $t('apple', 0) }}</p>
+<p>{{ $t('apple', 1) }}</p>
+<p>{{ $t('apple', { count: 10 }, 10) }}</p>
 ```
 
 Output is the below:
@@ -207,4 +207,4 @@ Output is the below:
 <p>10 apples</p>
 ```
 
-You need to specify the key that resolves the value specified with `$tc` or `tc`.
+You need to specify the key that resolves the value specified with `$t` or `t`.
diff --git a/docs/.ja/guide/essentials/pluralization.md b/docs/.ja/guide/essentials/pluralization.md
@@ -49,7 +49,7 @@ Vue I18nでは、いくつかの複数化の方法が提供されます。ここ
 
 <p>{{ $tc('apple', 0) }}</p>
 <p>{{ $tc('apple', 1) }}</p>
-<p>{{ $tc('apple', 10, { count: 10 }) }}</p>
+<p>{{ $tc('apple', { count: 10 }, 10) }}</p>
 ```
 
 上の`$tc`の使用例では、第1引数にロケールメッセージキー、第2引数に数字を指定しています。
@@ -96,7 +96,7 @@ const messages = {
 
 <p>{{ $tc('banana', 1, { n: 1 }) }}</p>
 <p>{{ $tc('banana', 1) }}</p>
-<p>{{ $tc('banana', 100, { n: 'too many' }) }}</p>
+<p>{{ $tc('banana', { n: 'too many' }, 100) }}</p>
 ```
 
 上記の例では、第1引数にロケールメッセージのキー、第2引数に数値またはオブジェクトを指定しています。

diff --git a/docs/guide/advanced/function.md b/docs/guide/advanced/function.md
@@ -188,12 +188,12 @@ const messages = {
 Template:
 
 ```html
-<p>{{ $tc('car', 1) }}</p>
-<p>{{ $tc('car', 2) }}</p>
+<p>{{ $t('car', 1) }}</p>
+<p>{{ $t('car', 2) }}</p>
 
-<p>{{ $tc('apple', 0) }}</p>
-<p>{{ $tc('apple', 1) }}</p>
-<p>{{ $tc('apple', 10, { count: 10 }) }}</p>
+<p>{{ $t('apple', 0) }}</p>
+<p>{{ $t('apple', 1) }}</p>
+<p>{{ $t('apple', { count: 10 }, 10) }}</p>
 ```
 
 Output is the below:
@@ -207,4 +207,4 @@ Output is the below:
 <p>10 apples</p>
 ```
 
-You need to specify the key that resolves the value specified with `$tc` or `tc`.
+You need to specify the key that resolves the value specified with `$t` or `t`.
diff --git a/docs/guide/essentials/pluralization.md b/docs/guide/essentials/pluralization.md
@@ -25,34 +25,33 @@ The `car` has `car | cars` pluralization message, while the `apple` has `no appl
 
 These plural messages are selected by the logic of the choice rule for each language in the translaton API according to the numeric value you specify at the translation API.
 
-Vue I18n offers some ways to support pluralization. Here we’ll use the `$tc`.
+Vue I18n offers some ways to support pluralization. Here we’ll use the `$t`.
 
 :::tip NOTE
-`$tc` has some overloads. About these overloads, see the [API Reference](../../api/injection#tc-key)
+`$t` has some overloads. About these overloads, see the [API Reference](../../api/injection#t-key)
 :::
 
 :::tip NOTE
 Some ways to support pluralization are:
 
-- `$tc` (for Legacy API mode)
+- injected gloal `$t`
 - `v-t` custom directive
 - built-in Translation component (`i18n-t`)
 - exported `t` from `useI18n` (for Composition API mode)
-- injected global `$t` (for Composition API mode)
 :::
 
 The following is an example of using the translation API.
 
 ```html
-<p>{{ $tc('car', 1) }}</p>
-<p>{{ $tc('car', 2) }}</p>
+<p>{{ $t('car', 1) }}</p>
+<p>{{ $t('car', 2) }}</p>
 
-<p>{{ $tc('apple', 0) }}</p>
-<p>{{ $tc('apple', 1) }}</p>
-<p>{{ $tc('apple', 10, { count: 10 }) }}</p>
+<p>{{ $t('apple', 0) }}</p>
+<p>{{ $t('apple', 1) }}</p>
+<p>{{ $t('apple', 10, { count: 10 }) }}</p>
 ```
 
-In the above example of using the `$tc`, the first argument is the locale messages key and the second argument is a number. The `$tc` returns the choice message as a result.
+In the above example of using the `$t`, the first argument is the locale messages key and the second argument is a number. The `$t` returns the choice message as a result.
 
 As result the below:
 
@@ -91,12 +90,12 @@ The number can be accessed within locale messages via predefined named arguments
 The following is an example of using `$tc`:
 
 ```html
-<p>{{ $tc('apple', 10, { count: 10 }) }}</p>
-<p>{{ $tc('apple', 10) }}</p>
+<p>{{ $t('apple', 10, { count: 10 }) }}</p>
+<p>{{ $t('apple', 10) }}</p>
 
-<p>{{ $tc('banana', 1, { n: 1 }) }}</p>
-<p>{{ $tc('banana', 1) }}</p>
-<p>{{ $tc('banana', 100, { n: 'too many' }) }}</p>
+<p>{{ $t('banana', 1, { n: 1 }) }}</p>
+<p>{{ $t('banana', 1) }}</p>
+<p>{{ $t('banana', 100, { n: 'too many' }) }}</p>
 ```
 
 In the above some examples, the first argument is the locale messages key and the second argument is the numeric value or object.
@@ -169,17 +168,17 @@ With the following template:
 
 ```html
 <h2>Car:</h2>
-<p>{{ $tc('car', 1) }}</p>
-<p>{{ $tc('car', 2) }}</p>
-<p>{{ $tc('car', 4) }}</p>
-<p>{{ $tc('car', 12) }}</p>
-<p>{{ $tc('car', 21) }}</p>
+<p>{{ $t('car', 1) }}</p>
+<p>{{ $t('car', 2) }}</p>
+<p>{{ $t('car', 4) }}</p>
+<p>{{ $t('car', 12) }}</p>
+<p>{{ $t('car', 21) }}</p>
 
 <h2>Banana:</h2>
-<p>{{ $tc('banana', 0) }}</p>
-<p>{{ $tc('banana', 4) }}</p>
-<p>{{ $tc('banana', 11) }}</p>
-<p>{{ $tc('banana', 31) }}</p>
+<p>{{ $t('banana', 0) }}</p>
+<p>{{ $t('banana', 4) }}</p>
+<p>{{ $t('banana', 11) }}</p>
+<p>{{ $t('banana', 31) }}</p>
 ```
 
 As result the below:

diff --git a/examples/legacy/functions/plural.html b/examples/legacy/functions/plural.html
@@ -9,17 +9,17 @@
   <body>
     <div id="app">
       <h2>Car:</h2>
-      <p class="p1">{{ $tc('car', 1) }}</p>
-      <p class="p2">{{ $tc('car', 2) }}</p>
+      <p class="p1">{{ $t('car', 1) }}</p>
+      <p class="p2">{{ $t('car', 2) }}</p>
       <h2>Apple:</h2>
-      <p class="p3">{{ $tc('apple', 0) }}</p>
-      <p class="p4">{{ $tc('apple', 1) }}</p>
-      <p class="p5">{{ $tc('apple', 10, { count: 10 }) }}</p>
-      <p class="p6">{{ $tc('apple', 10) }}</p>
+      <p class="p3">{{ $t('apple', 0) }}</p>
+      <p class="p4">{{ $t('apple', 1) }}</p>
+      <p class="p5">{{ $t('apple', { count: 10 }, 10) }}</p>
+      <p class="p6">{{ $t('apple', 10) }}</p>
       <h2>Banana:</h2>
-      <p class="p7">{{ $tc('banana', 1, { n: 1 }) }}</p>
-      <p class="p8">{{ $tc('banana', 1) }}</p>
-      <p class="p9">{{ $tc('banana', 100, { n: 'too many' }) }}</p>
+      <p class="p7">{{ $t('banana', { n: 1 }, 1) }}</p>
+      <p class="p8">{{ $t('banana', 1) }}</p>
+      <p class="p9">{{ $t('banana', { n: 'too many' }, 100) }}</p>
     </div>
     <script>
       const { createApp } = Vue

diff --git a/examples/legacy/plural/basic.html b/examples/legacy/plural/basic.html
@@ -9,17 +9,17 @@
   <body>
     <div id="app">
       <h2>Car:</h2>
-      <p class="p1">{{ $tc('car', 1) }}</p>
-      <p class="p2">{{ $tc('car', 2) }}</p>
+      <p class="p1">{{ $t('car', 1) }}</p>
+      <p class="p2">{{ $t('car', 2) }}</p>
       <h2>Apple:</h2>
-      <p class="p3">{{ $tc('apple', 0) }}</p>
-      <p class="p4">{{ $tc('apple', 1) }}</p>
-      <p class="p5">{{ $tc('apple', 10, { count: 10 }) }}</p>
-      <p class="p6">{{ $tc('apple', 10) }}</p>
+      <p class="p3">{{ $t('apple', 0) }}</p>
+      <p class="p4">{{ $t('apple', 1) }}</p>
+      <p class="p5">{{ $t('apple', { count: 10 }, 10) }}</p>
+      <p class="p6">{{ $t('apple', 10) }}</p>
       <h2>Banana:</h2>
-      <p class="p7">{{ $tc('banana', 1, { n: 1 }) }}</p>
-      <p class="p8">{{ $tc('banana', 1) }}</p>
-      <p class="p9">{{ $tc('banana', 100, { n: 'too many' }) }}</p>
+      <p class="p7">{{ $t('banana', { n: 1 }, 1) }}</p>
+      <p class="p8">{{ $t('banana', 1) }}</p>
+      <p class="p9">{{ $t('banana', { n: 'too many' }, 10) }}</p>
     </div>
     <script>
       const { createApp } = Vue

diff --git a/examples/legacy/plural/custom.html b/examples/legacy/plural/custom.html
@@ -9,17 +9,17 @@
   <body>
     <div id="app">
       <h2>Car:</h2>
-      <p class="p1">{{ $tc('car', 1) }}</p>
-      <p class="p2">{{ $tc('car', 2) }}</p>
-      <p class="p3">{{ $tc('car', 4) }}</p>
-      <p class="p4">{{ $tc('car', 12) }}</p>
-      <p class="p5">{{ $tc('car', 21) }}</p>
+      <p class="p1">{{ $t('car', 1) }}</p>
+      <p class="p2">{{ $t('car', 2) }}</p>
+      <p class="p3">{{ $t('car', 4) }}</p>
+      <p class="p4">{{ $t('car', 12) }}</p>
+      <p class="p5">{{ $t('car', 21) }}</p>
 
       <h2>Banana:</h2>
-      <p class="p6">{{ $tc('banana', 0) }}</p>
-      <p class="p7">{{ $tc('banana', 4) }}</p>
-      <p class="p8">{{ $tc('banana', 11) }}</p>
-      <p class="p9">{{ $tc('banana', 31) }}</p>
+      <p class="p6">{{ $t('banana', 0) }}</p>
+      <p class="p7">{{ $t('banana', 4) }}</p>
+      <p class="p8">{{ $t('banana', 11) }}</p>
+      <p class="p9">{{ $t('banana', 31) }}</p>
     </div>
     <script>
       const { createApp } = Vue