FROM CACHE - jp_header
解決済

App BridgeにおけるContextコンポーネントの役割について教えてください

echizenyayota
Shopify Partner
19 1 3

下記の質問についてご存知の方がいらっしゃいましたらご教示を願います。

チュートリアルの pages/components/ResourceList.js の13行目に書かれている、下記のコードについて質問です。

import { Context } from '@shopify/app-bridge-react';

 

ContextはShopifyが開発したReactコンポーネントの1つのように見えます。
ですがShopify.dev が公開しているApp Bridgeのドキュメントのどこで言及されているのか分かりません。

1.png




このContextにはどのような役割があるのでしょうか?
もしShopify.devの公式ドキュメント内で、Context コンポーネントに関する説明が存在するのであれば、そのURLも教えていただければ助かります。

以上、よろしくお願いします。

1 件の受理された解決策

junichiokamura
Community Manager
1200 280 506

成功

Contextの参照部分をご覧いただけると大体わかると思うんですが、これはApp Bridgeの固有のオブジェクトや機能ではなくて、Reactのオブジェクト(仕組み)と言えます。

以下を参考にしてみてください。

https://reactjs.org/docs/context.html

https://qiita.com/ryokkkke/items/dc25111fcf52ea579d58

2つ目の記事でContextTypeについても説明があり、サンプルコードで static contextType = ResourceContext; という行がありますが、

チュートリアルでも同じようにClassの定義内で、static contextType = Context; と記載があります。

ちゃんと理解するには、ReactのContextの仕組みと意義を把握する必要がありますが、とりあえずReactを使う際のおまじないみたいなものだと思って、Shopify固有の仕様ではないと捉えておけば良いかと思います。

Senior Partner Solutions Engineer

元の投稿で解決策を見る

2件の返信2

junichiokamura
Community Manager
1200 280 506

成功

Contextの参照部分をご覧いただけると大体わかると思うんですが、これはApp Bridgeの固有のオブジェクトや機能ではなくて、Reactのオブジェクト(仕組み)と言えます。

以下を参考にしてみてください。

https://reactjs.org/docs/context.html

https://qiita.com/ryokkkke/items/dc25111fcf52ea579d58

2つ目の記事でContextTypeについても説明があり、サンプルコードで static contextType = ResourceContext; という行がありますが、

チュートリアルでも同じようにClassの定義内で、static contextType = Context; と記載があります。

ちゃんと理解するには、ReactのContextの仕組みと意義を把握する必要がありますが、とりあえずReactを使う際のおまじないみたいなものだと思って、Shopify固有の仕様ではないと捉えておけば良いかと思います。

Senior Partner Solutions Engineer
echizenyayota
Shopify Partner
19 1 3

junichiokamura さん。
コメントと関連リンクの紹介ありがとうございます!

> ちゃんと理解するには、ReactのContextの仕組みと意義を把握する必要がありますが、とりあえずReactを使う際のおまじないみたいなものだと思って、Shopify固有の仕様ではないと捉えておけば良いかと思います。

了解しました。
この質問に関して分からないことがあれば、紹介していただいたReactの公式ドキュメントの記事を参考にします。
今後ともどうぞよろしくお願いします。