該当箇所の訳出 #1371

superyusuke · 2018-12-31T09:54:47Z

概要

resolve #1297

リントの語調統一ルールにひっかかって、エラーが出た状態でプルリク出させていただきました。自分ではですますに統一したつもりです。申し訳ありません。

補足

potato4d

ひとまず誤検知について該当箇所を書きました！ Suggestion も使ってあるので、適宜取り込んで修正お願いします 🙇

src/v2/cookbook/practical-use-of-scoped-slots.md

提案ありがとうございます。そのまま採用させてください。 Co-Authored-By: superyusuke <nakanishiyusuke0000@gmail.com>

…nto practical-use-of-scoped-slots # Conflicts: # src/v2/cookbook/practical-use-of-scoped-slots.md

superyusuke · 2018-12-31T17:31:09Z

一旦申請しました〜

kazupon

レビュー 👀 コメント 💬 しました。
対応お願いします。

後、いくつか 訳注 が入っていますが、日本語公式ドキュメントの貢献ガイドラインでは書いていませんが、あまり入れない形で訳して提供しています。

訳注あると確かに読み手の参考になっていいのですが、なるべく無い形にしたいので、文章に意訳的な形で盛り込む形式にしてもらえると助かります。

どうしても、訳注として残したい場合は、コメントください。

kazupon · 2019-01-01T17:10:06Z

src/v2/cookbook/practical-use-of-scoped-slots.md

-There are situations when you want the template inside the slot to be able to access data from the child component that is responsible for rendering the slot content. This is particularly useful when you need freedom in creating custom templates that use the child component's data properties. That is a typical use case for scoped slots.
+> Base Example
+
+slot 内の template が、slot の content をレンダリングをする役割を持った子コンポーネントの側の「データ」へ、アクセスできたらいいのに、と思うことはないでしょうか。


slot、template、そして content をそのまま英語のままにしていますが、ここの文章の文脈では、特にそのまま訳しても文章として問題ないので、訳すようお願いします。
ref: 日本語公式ドキュメント
https://jp.vuejs.org/v2/guide/components-slots.html

kazupon · 2019-01-01T17:11:21Z

src/v2/cookbook/practical-use-of-scoped-slots.md

+
+> There are situations when you want the template inside the slot to be able to access data from the child component that is responsible for rendering the slot content. 
+
+とくにそれが有効なのは、子コンポーネントの data プロパティを使用するカスタム template を作成する必要がある場合です。まさに `scoped slots` を使用するのに最適な場面です。  


ここの文章も template も同じく、文脈上問題ないので、訳すようお願いします。 🙏

scoped slots ですが、なるべく日本語公式ドキュメントを一貫性保ちたいので、こちらも スコープ付きスロット で訳お願いします。
スコープ付きスロット (scoped slots) でも可です。

kazupon · 2019-01-01T17:12:43Z

src/v2/cookbook/practical-use-of-scoped-slots.md

+
+> This is particularly useful when you need freedom in creating custom templates that use the child component's data properties. That is a typical use case for scoped slots.
+
+外部 API の設定と使用準備をするコンポーネントを実装する場合を想定してみましょう。そのコンポーネントは、他のコンポーネントから使用されるわけですが、具体的な template と密接には結びついません。そのためレンダリングする template が異なる様々な場所で使いまわすことができ、それでいて特定の API を持つ同じベースオブジェクトを使用します。


ここの template も上記コメントと同じく、訳すようお願いします。

kazupon · 2019-01-01T17:18:42Z

src/v2/cookbook/practical-use-of-scoped-slots.md

+
+1.  [Google Maps API](https://developers.google.com/maps/documentation/javascript/reference/) を初期化する。
+2. `google` と `map` の2つの object を作成する。
+3. これら2つの object を `GoogleMapLoader` を使用する親コンポーネントに対して露出させている。


露出 という expose の訳はあまりソフトウェア業界の翻訳用語としてはあまり聞かないので、ここでは 公開 という意訳の方がよいと思います。

kazupon · 2019-01-01T17:25:32Z

src/v2/cookbook/practical-use-of-scoped-slots.md


 `GoogleMapLoader.vue`

-In the template, we create a container for the map which will be used to mount the [Map](https://developers.google.com/maps/documentation/javascript/reference/map#Map) object extracted from the Google Maps API.
+template の中にマップのためのコンテナを作成しましょう。このコンテナへ Google Maps API から抽出した [Map](https://developers.google.com/maps/documentation/javascript/reference/map#Map) がマウントされます。


ここの template は、 SFC の template ブロックのことなので、この文章ではこのままででいいですが、注釈しておくと分かりやすいですね。

(そもそも、原文もちょっと分かりづらいですね。。。せめて quote してあると分かりやすいですね。。。余力があれば、本家にPR送ってもいいかもしれません。)

kazupon · 2019-01-01T18:33:28Z

src/v2/cookbook/practical-use-of-scoped-slots.md

@@ -337,7 +438,9 @@ Here we go, integrating the data points directly into the template:
 </GoogleMapLoader>
 ```

-We need to import the required factory components in our script and set the data that will be passed to the markers and lines:
+それから script の中で、factory component を script の中でインポートし、marker と lines という名前でコンポーネントに値をセットします。


Suggested change

それから script の中で、factory component を script の中でインポートし、marker と lines という名前でコンポーネントに値をセットします。

それから script の中で、ファクトリーコンポーネントを script の中でインポートし、marker と lines という名前でコンポーネントに値をセットします。

factory component の訳、統一するために訳しました。

kazupon · 2019-01-01T18:34:51Z

src/v2/cookbook/practical-use-of-scoped-slots.md

@@ -379,9 +482,18 @@ export default {
 ```

 ## When To Avoid This Pattern


ここの部分、訳漏れているようなので、お願いします！ 🙏

kazupon · 2019-01-01T18:36:23Z

src/v2/cookbook/practical-use-of-scoped-slots.md


-## Wrapping Up
-That's it. With all those bits and pieces created we can now re-use the `GoogleMapLoader` component as a base for all our maps by passing different templates to each one of them. Imagine that you need to create another map with different Markers or just Markers without Polylines. By using the above pattern it becomes very easy as we just need to pass different content to the `GoogleMapLoader` component.
+このような非常に複雑な解決法は魅力的に思われるかもしれませんが、ある一定のレベルまでその複雑さが進んでしまうと、その抽象性が、この機能を構成する他のコードの部分よりもかなり高くなってしまい、浮いた存在になってしまうでしょう。その段階にまできた場合には、add-on に抽出することを検討する段階でしょう。(訳注: add-on はおそらく、plugin や mixin などのことです)


Suggested change

このような非常に複雑な解決法は魅力的に思われるかもしれませんが、ある一定のレベルまでその複雑さが進んでしまうと、その抽象性が、この機能を構成する他のコードの部分よりもかなり高くなってしまい、浮いた存在になってしまうでしょう。その段階にまできた場合には、add-on に抽出することを検討する段階でしょう。(訳注: add-on はおそらく、plugin や mixin などのことです)

このような非常に複雑な解決法は魅力的に思われるかもしれませんが、ある一定のレベルまでその複雑さが進んでしまうと、その抽象性が、この機能を構成する他のコードの部分よりもかなり高くなってしまい、浮いた存在になってしまうでしょう。その段階にまできた場合には、プラグインやミックスインのようなアドオンとして抽出することを検討する段階でしょう。

訳注は文章の意訳的に含めてこのように訳した文章にするといいと思います。

kazupon · 2019-01-01T18:38:55Z

src/v2/cookbook/practical-use-of-scoped-slots.md

+## まとめ
+> Wrapping Up
+
+さあ全てやりとげました。こまごまと作業をしてきた結果として `GoogleMapLoader` コンポーネントを、マップを使う際のベースとして使いまわすことができるようになりました。それぞれの用途に合わせた template を渡せばこのコンポーネントに渡せば、どんなものにでも対応できます。例えば今回のケースとは異なるマーカーや、ポリラインがない場合にも使えますね。今回紹介したパターンを使うことで `GoogleMapLoader` にケースによってことなる必要なコンテンツを渡すだけで、この目的を達成できます。


Suggested change

さあ全てやりとげました。こまごまと作業をしてきた結果として `GoogleMapLoader` コンポーネントを、マップを使う際のベースとして使いまわすことができるようになりました。それぞれの用途に合わせた template を渡せばこのコンポーネントに渡せば、どんなものにでも対応できます。例えば今回のケースとは異なるマーカーや、ポリラインがない場合にも使えますね。今回紹介したパターンを使うことで `GoogleMapLoader` にケースによってことなる必要なコンテンツを渡すだけで、この目的を達成できます。

以上です。こまごまと作業をしてきた結果として `GoogleMapLoader` コンポーネントを、マップを使う際のベースとして使いまわすことができるようになりました。それぞれの用途に合わせたテンプレートをこのコンポーネントに渡せば、どんなものにでも対応できます。例えば今回のケースとは異なるマーカーや、ポリラインがない場合にも使えます。今回紹介したパターンを使うことで `GoogleMapLoader` にケースによってことなる必要なコンテンツを渡すだけで、この目的を達成できます。

That's it ですが、以上です。 のような方が、硬すぎず、ゆるすぎず、読みてにはちょうどいいです。

kazupon · 2019-01-01T18:42:08Z

src/v2/cookbook/practical-use-of-scoped-slots.md

+
+> That's it. With all those bits and pieces created we can now re-use the `GoogleMapLoader` component as a base for all our maps by passing different templates to each one of them. Imagine that you need to create another map with different Markers or just Markers without Polylines. By using the above pattern it becomes very easy as we just need to pass different content to the `GoogleMapLoader` component.
+
+このパターンは Google Map の場合にしか使えないわけではありません。どんなライブラリの場合にも、ベースとなるコンポーネントをセットして、(ベースコンポーネントを呼び出したコンポーネントが実行する) API を露出させればいいのです。


Suggested change

このパターンは Google Map の場合にしか使えないわけではありません。どんなライブラリの場合にも、ベースとなるコンポーネントをセットして、(ベースコンポーネントを呼び出したコンポーネントが実行する) API を露出させればいいのです。

このパターンは Google Map の場合にしか使えないわけではありません。どんなライブラリの場合にも、ベースとなるコンポーネントをセットして、(ベースコンポーネントを呼び出したコンポーネントが実行する) API を公開させればいいのです。

ここの 露出 も 公開 でお願いします。

potato4d · 2019-01-11T04:24:21Z

@superyusuke
こちらいかがでしょうか？もし忙しいようであれば、連休中に引き継いでやることも可能なので、ご連絡いただければと思います。
もちろん、引き続き対応してもらう形でも大丈夫です！

superyusuke · 2019-01-11T09:09:47Z

@potato4d
連絡遅くなり申し訳ありません…
訳注をいれずに文章に入れるというのが少し難しく、できれば引き継いでいただけると助かります。

potato4d · 2019-01-25T04:36:34Z

@superyusuke
遅くなりました。引き継ぎますー。

potato4d · 2019-02-18T14:46:40Z

この PR のまま引き継ぐのがちょっとコスト的に高いので別途 PR を出します 🙇

@posva

* Create new page * Update * Improve intro * Update * Add Example * Include real world example and explanation about testing * Added "Why vue" en, cn srt files into assets folder (vuejs#1367) * added english srt file * added chinese srt file * typo * fix: Correct sidebar anchor targets (vuejs#1366) Change function execution order to correct sidebar anchor targets; more concise fix to vuejs/v2.vuejs.org#1348. * Images not found. (vuejs#1365) Hi, The images link for `hn.png` and `hn-architecture.png` can be found on `../../images/`. * [Doc EN]: `event.md` add space to new part (vuejs#1363) * New in with + symbol Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com> * Review of 2.5.0 doc Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com> * Review Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com> * Fix syntax typo Signed-off-by: Bruno Lesieur <bruno.lesieur@gmail.com> * Add space between new line of documentation Signed-off-by: MachinisteWeb <bruno.lesieur@gmail.com> * Add @posva review Signed-off-by: MachinisteWeb <bruno.lesieur@gmail.com> * Retrieve tweeningValue from onUpdate callback in documentation (vuejs#1350) The tweeningValue no longer seems to be available in the tween object itself. Instead, the tweeningValue is available in the tweened object that passed as a parameter to the onUpdate callback. * Add watch usages (vuejs#1356) * Add watch usages! Add `watch` usages! * Update index.md * tweaks to watch api examples * Avoid updating license every year (vuejs#1353) * Update spelling error and add some details about what we are testing * Update * typo for chinese subtitles of "why vue" video (vuejs#1371) * Adding Why Vue.js video to Introduction page (vuejs#1377) * Added video into guide introduction * Added modal styles to page, put video line on one file, and reset iframe margin * Fixed typo in Gulp example in deployment.md (vuejs#1376) * Update deployment.md with Grunt example (vuejs#1375) * Decoupled video player from Vimeo (vuejs#1374) * Update Installation guide to use https://caniuse.com (vuejs#1372) * [HOTFIX] initVideoModal error in common.js (vuejs#1378) * Showing all possible params of watch() (vuejs#1380) Surprised that the documentation didn't include the fact that the 2nd argument is the previous value. This can be really useful in some cases! * refactor & update sponsors display * include bronze data * fix link * fix link * add build script * update deploy docs * Small fixes (vuejs#1381) * fixed video modal bug in guide/index.md * removed unnecessary sponsors content which has been in theme layout now * fixed sponsors dropdown menu * fixed button style in team page * update Guillaume's core focus * Improve based on Sarah Drasner feedback and fix some grammar * Fixed TYPO Automatic Key Modifiers (vuejs#1388) * update community deployment instructions * Tweak wording of `.passive` modifier explanation * Add guide link in Vue.filter API (vuejs#1394) * Update filters, global filters needs to go before Vue instance creation (vuejs#1392) Global filters defined after creating the Vue instance throws `Failed to resolve filter`. Reference https://forum.vuejs.org/t/global-filters-failing-to-resolve-inside-single-file-components/21863/6 * update tree-view example to add v-for key * add details of object merging to mixins page * Revise beforeUpdate API entry, fixes vuejs/vue#7481 (vuejs#1395) * fix vue team distance sorting * Add explicit version to download links (vuejs#1398) * Add explicit version to download links * improve CDN section of installation page * demo from ’Object Change Detection‘ doesn't work (vuejs#1397) vm.$set(this.userProfile, 'age', 27) ==> vm.$set(vm.userProfile, 'age', 27); * Updated description of Weex (vuejs#1396) * updated description of Weex (close vuejs#1382) * Update comparison.md * Update "incubated to" -> "incubated by" * Update comparison.md * Update comparison.md * fix vue component require syntax for modern vue-loader * The Web Optimization Project has optimized your repository! (vuejs#1389) The Web Optimization Project optimized this repository. This commit contains the optimized files in this repository. * Fix wrapperfind(error) typo and add example to test for whitespace * Update * Use factory function to save redundant logic * Add factory function explanation and link to vue test utils guides. * Update using codebryo feedback * Change Github to GitHub (vuejs#1399) * Fixed js error when click the page (vuejs#1401) * Change cookbook entry number and reformat sentence * Change order * fix: typo in v-show description (vuejs#1408) * Create new page * Update * Improve intro * Update * Add Example * Include real world example and explanation about testing * Update spelling error and add some details about what we are testing * Update * Improve based on Sarah Drasner feedback and fix some grammar * Fix wrapperfind(error) typo and add example to test for whitespace * Update * Use factory function to save redundant logic * Add factory function explanation and link to vue test utils guides. * Update using codebryo feedback * Change cookbook entry number and reformat sentence * Change order * Rebase

該当箇所の訳出

3775434

pr-triage bot added the PR: unreviewed label Dec 31, 2018

potato4d requested changes Dec 31, 2018

View reviewed changes

src/v2/cookbook/practical-use-of-scoped-slots.md Outdated Show resolved Hide resolved

src/v2/cookbook/practical-use-of-scoped-slots.md Outdated Show resolved Hide resolved

src/v2/cookbook/practical-use-of-scoped-slots.md Outdated Show resolved Hide resolved

pr-triage bot added PR: reviewed-changes-requested and removed PR: unreviewed labels Dec 31, 2018

Update src/v2/cookbook/practical-use-of-scoped-slots.md

22a70e3

提案ありがとうございます。そのまま採用させてください。 Co-Authored-By: superyusuke <nakanishiyusuke0000@gmail.com>

pr-triage bot added PR: unreviewed and removed PR: reviewed-changes-requested labels Dec 31, 2018

udemy-react-super-yusuke added 2 commits January 1, 2019 02:27

ですますリント対策

8b06c56

Merge remote-tracking branch 'origin/practical-use-of-scoped-slots' i…

86f51a7

…nto practical-use-of-scoped-slots # Conflicts: # src/v2/cookbook/practical-use-of-scoped-slots.md

kazupon requested changes Jan 1, 2019

View reviewed changes

pr-triage bot added PR: reviewed-changes-requested and removed PR: unreviewed labels Jan 1, 2019

potato4d closed this Feb 18, 2019

potato4d mentioned this pull request Feb 18, 2019

[Cookbook] Practical use of scoped slots with GoogleMapsの翻訳 #1297

Open

syagawa pushed a commit to syagawa/jp.vuejs.org that referenced this pull request Jun 20, 2019

typo for chinese subtitles of "why vue" video (vuejs#1371) (vuejs#604)

b8eee57

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

該当箇所の訳出 #1371

該当箇所の訳出 #1371

superyusuke commented Dec 31, 2018

potato4d left a comment

superyusuke commented Dec 31, 2018

kazupon left a comment

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

kazupon Jan 1, 2019

potato4d commented Jan 11, 2019

superyusuke commented Jan 11, 2019

potato4d commented Jan 25, 2019

potato4d commented Feb 18, 2019


		> There are situations when you want the template inside the slot to be able to access data from the child component that is responsible for rendering the slot content.

		とくにそれが有効なのは、子コンポーネントの data プロパティを使用するカスタム template を作成する必要がある場合です。まさに `scoped slots` を使用するのに最適な場面です。


		> This is particularly useful when you need freedom in creating custom templates that use the child component's data properties. That is a typical use case for scoped slots.

		外部 API の設定と使用準備をするコンポーネントを実装する場合を想定してみましょう。そのコンポーネントは、他のコンポーネントから使用されるわけですが、具体的な template と密接には結びついません。そのためレンダリングする template が異なる様々な場所で使いまわすことができ、それでいて特定の API を持つ同じベースオブジェクトを使用します。

	それから script の中で、factory component を script の中でインポートし、marker と lines という名前でコンポーネントに値をセットします。
	それから script の中で、ファクトリーコンポーネントを script の中でインポートし、marker と lines という名前でコンポーネントに値をセットします。

		@@ -379,9 +482,18 @@ export default {
		```

		## When To Avoid This Pattern


		> That's it. With all those bits and pieces created we can now re-use the `GoogleMapLoader` component as a base for all our maps by passing different templates to each one of them. Imagine that you need to create another map with different Markers or just Markers without Polylines. By using the above pattern it becomes very easy as we just need to pass different content to the `GoogleMapLoader` component.

		このパターンは Google Map の場合にしか使えないわけではありません。どんなライブラリの場合にも、ベースとなるコンポーネントをセットして、(ベースコンポーネントを呼び出したコンポーネントが実行する) API を露出させればいいのです。

該当箇所の訳出 #1371

該当箇所の訳出 #1371

Conversation

superyusuke commented Dec 31, 2018

概要

補足

potato4d left a comment

Choose a reason for hiding this comment

superyusuke commented Dec 31, 2018

kazupon left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

potato4d commented Jan 11, 2019

superyusuke commented Jan 11, 2019

potato4d commented Jan 25, 2019

potato4d commented Feb 18, 2019