Skip to content

Commit 4988121

Browse files
committed
fix: improve component attrs section
vuejs/docs@b7b3202
1 parent 9daa352 commit 4988121

File tree

1 file changed

+4
-4
lines changed

1 file changed

+4
-4
lines changed

src/guide/component-attrs.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
> このページは [コンポーネントの基本](component-basics.md) が読まれていることが前提となっています。 コンポーネントを扱った事のない場合はこちらのページを先に読んでください。
44
5-
プロパティでない属性とは、コンポーネントに渡される属性やイベントリスナのうち、[props](component-props)[emits](component-custom-events.html#defining-custom-events) で定義されたものを除いたものをいいます。よくある例としては、コンポーネント要素タグに付与する `class``style``id` などの属性があります。
5+
プロパティでない属性とは、コンポーネントに渡される属性やイベントリスナのうち、[props](component-props)[emits](component-custom-events.html#defining-custom-events) で定義されたものを除いたものをいいます。よくある例としては、コンポーネント要素タグに付与する `class``style``id` などの属性があります。これらの属性には `$attrs` プロパティでアクセスできます。
66

77
## 属性の継承
88

@@ -18,7 +18,7 @@ app.component('date-picker', {
1818
})
1919
```
2020

21-
`data-status` 属性を用いて date-picker コンポーネントの状態を定義するような場合には、この属性はルート要素 (すなわち `div.date-picker`) に適用されます。
21+
`data-status` 属性を用いて date-picker コンポーネントの状態を定義するような場合には、この属性はルート要素 (すなわち `div.date-picker`) に適用されます。
2222

2323
```html
2424
<!-- プロパティでない属性 とともに用いられる Date-picker コンポーネント -->
@@ -78,11 +78,11 @@ const app = Vue.createApp({
7878

7979
## 属性の継承の無効化
8080

81-
コンポーネントのオプション内で、`inheritAttrs: false`を指定することで、属性の継承を **無効化** することも可能です。
81+
コンポーネントのオプション内で、`inheritAttrs: false` を指定することで、属性の継承を **無効化** することも可能です。
8282

8383
一般的に属性の継承の無効化は、ルート要素ではない別の要素に属性を適用したいようなケースで利用される場面が考えられるでしょう。
8484

85-
`inheritAttrs``false` にセットした場合属性の継承は無効化されますが、`inheritAttrs` の設定に関わらずコンポーネントの `$attrs` プロパティから`props``emits`といったコンポーネントのプロパティを除く全ての属性(例えば`class``style` `v-on` といったものも)にアクセスすることができます
85+
`inheritAttrs``false` にセットした場合属性の継承は無効化されますが、`inheritAttrs` の設定に関わらずコンポーネントの `$attrs` プロパティを使って`props``emits` といったコンポーネントのプロパティを除く全ての属性例えば `class``style``v-on` といったものも)を他の要素の属性への適用することを制御できます
8686

8787
[前節](#属性の継承) で利用した date-picker のコンポーネント例を用いて、プロパティでない属性の全てを ルートの `div` 要素ではなく `input` 要素に適用する場合、`v-bind` を用いて簡略的に記述することも可能です。
8888

0 commit comments

Comments
 (0)