@@ -53,7 +53,7 @@ vue add typescript
53
53
54
54
### エディタによるサポート
55
55
56
- TypeScript による Vue アプリケーションの開発のために、すぐに利用できる TypeScript サポートを提供している [ Visual Studio Code] ( https://code.visualstudio.com/ ) を強く推奨します。[ シングルファイルコンポーネント ] ( ./single-file-components.html ) (SFCs) を使用している場合、SFC 内部での TypeScript の推論やその他の優れた機能を提供している、素晴らしい素晴らしい [ Vetur エクステンション] ( https://github.com/vuejs/vetur ) を入手してください。
56
+ TypeScript による Vue アプリケーションの開発のために、すぐに利用できる TypeScript サポートを提供している [ Visual Studio Code] ( https://code.visualstudio.com/ ) を強く推奨します。[ 単一ファイルコンポーネント ] ( ./single-file-components.html ) (SFCs) を使用している場合、SFC 内部での TypeScript の推論やその他の優れた機能を提供している、素晴らしい [ Vetur エクステンション] ( https://github.com/vuejs/vetur ) を入手してください。
57
57
58
58
[ WebStorm] ( https://www.jetbrains.com/webstorm/ ) もすぐに利用できる TypeScript と Vue のサポートを提供しています。
59
59
@@ -86,7 +86,7 @@ const Component = defineComponent({
86
86
})
87
87
```
88
88
89
- 複雑な型や推論の場合、[ タイプアサーション] ( https://www.typescriptlang.org/docs/handbook/basic-types.html#type-assertions ) を使用してキャストすることができます:
89
+ 複雑な型や推論の場合、[ タイプアサーション (type assertion) ] ( https://www.typescriptlang.org/docs/handbook/basic-types.html#type-assertions ) を使用してキャストすることができます:
90
90
91
91
``` ts
92
92
interface Book {
@@ -140,7 +140,7 @@ const Component = defineComponent({
140
140
})
141
141
```
142
142
143
- ### プロパティにアノテーションをつける
143
+ ### Props にアノテーションをつける
144
144
145
145
Vue は ` type ` が定義されたプロパティについてランタイムバリデーションを行います。これらの型を TypeScript に提供するため、` PropType ` を伴うコンストラクタをキャストする必要があります:
146
146
@@ -190,7 +190,7 @@ const Component = defineComponent({
190
190
191
191
setup(props ) {
192
192
const result = props .message .split (' ' ) // 正しいです, 'message' は文字列 (string) として型づけされます
193
- const filtered = props .message .filter (p => p .value ) // エラーが起こります: 'filter' プロパティは文字列 (string) 型には存在しません。
193
+ const filtered = props .message .filter (p => p .value ) // エラーが起こります: Property 'filter' does not exist on type 'string'
194
194
}
195
195
})
196
196
```
@@ -208,7 +208,6 @@ const Component = defineComponent({
208
208
const year = ref (2020 )
209
209
210
210
const result = year .value .split (' ' ) // => Property 'split' does not exist on type 'number'
211
- const result = year .value .split (' ' ) // => 'split' プロパティは 'number' 型に存在しません
212
211
}
213
212
})
214
213
```
@@ -263,10 +262,10 @@ export default defineComponent({
263
262
setup() {
264
263
let count = ref (0 )
265
264
266
- // リードオンリー
265
+ // 読み取り専用
267
266
const doubleCount = computed (() => count .value * 2 )
268
267
269
- const result = doubleCount .value .split (' ' ) // => 'split' プロパティは 'number' 型に存在しません。
268
+ const result = doubleCount .value .split (' ' ) // Property 'split' does not exist on type 'number'
270
269
}
271
270
})
272
271
```
0 commit comments