SwiftUIでいつでも親ビューとして子ビューからデータにアクセスするにはどうすればよいですか?

3
Jnguyen22 2019-08-22 21:54.

私はSwiftUIを初めて使用し、何らかの方法でEnvironmentObjectを実装する必要があるかもしれないことを理解していますが、この場合の方法はわかりません。

これはTradeクラスです

class Trade {
    var teamsSelected: [Team]

    init(teamsSelected: [Team]) {
        self.teamsSelected = teamsSelected
    }
}

これは子ビューです。これは、インスタンスがあるtradeからTradeクラスを。配列に1を追加するボタンがありますteamsSelected

struct TeamRow: View {
    var trade: Trade

    var body: some View {
        Button(action: {
            self.trade.teamsSelected.append(1)
        }) {
            Text("Button")
        }
    }
}

これは親ビューです。ご覧のとおりtrade、子ビューに移りますTeamRow。私はしたいtradeと同期することtradeTeamRow、私はそれから渡すことができるようtrade.teamsSelectedTradeView

struct TeamSelectView: View {
    var trade = Trade(teamsSelected: [])

    var body: some View {
        NavigationView{
            VStack{
                NavigationLink(destination: TradeView(teamsSelected: trade.teamsSelected)) {
                   Text("Trade")
                }

                List {
                    ForEach(teams) { team in
                        TeamRow(trade: self.trade)
                    }
                }
            }
        }
    }
}

3 answers

7
graycampbell 2019-08-23 16:34.

私はあなたのコードを撮影しSwiftUIはあなたにどのように使用するのより良い理解を与えるためにどのように動作するかを説明するためにいくつかのことを変更したObservableObject@ObservedObject@State、と@Binding

@ObservedObject前もって言及することの1つ-iOS13 Beta 6、7、または8を実行している物理デバイスでSwiftUIコードを実行しようとすると、現在壊れています。ここで、より詳細に説明し、@EnvironmentObjectとして使用する方法を説明する質問に答えました。回避策。


まず、を見てみましょうTradeTradeビュー間でオブジェクトを渡し、そのTradeオブジェクトのプロパティを変更してから、そのTradeオブジェクトを使用するすべてのビューにそれらの変更を反映させることを検討しているためTrade、を作成する必要がありObservableObjectます。Trade後で説明する説明のためだけに、クラスにプロパティを追加しました。を書く2つの方法を紹介します。ObservableObject最初に冗長な方法でどのように機能するかを確認し、次に簡潔な方法を示します。

import SwiftUI
import Combine

class Trade: ObservableObject {
    let objectWillChange = PassthroughSubject<Void, Never>()

    var name: String {
        willSet {
            self.objectWillChange.send()
        }
    }

    var teamsSelected: [Int] {
        willSet {
            self.objectWillChange.send()
        }
    }

    init(name: String, teamsSelected: [Int]) {
        self.name = name
        self.teamsSelected = teamsSelected
    }
}

に準拠する場合ObservableObject、独自のを作成するオプションがありますObservableObjectPublisher。これは、をインポートCombineして作成することで実行しましたPassthroughSubject。私は私のオブジェクトが変更されることを公開したいときに、私が呼び出すことができますself.objectWillChange.send()私が持っているようにwillSetするためにnameteamsSelected

ただし、このコードは大幅に短縮できます。ObservableObjectオブジェクトパブリッシャーを自動的に合成するため、実際に自分で宣言する必要はありません。また、使用することができます@Published代わりに使用しての発行イベントを送信する必要があり、当社のプロパティを宣言するself.objectWillChange.send()にはwillSet

import SwiftUI

class Trade: ObservableObject {
    @Published var name: String
    @Published var teamsSelected: [Int]

    init(name: String, teamsSelected: [Int]) {
        self.name = name
        self.teamsSelected = teamsSelected
    }
}

今度は、あなたを見てみましょうTeamSelectViewTeamRowTradeView。いくつかTradeViewのことを説明するために、いくつかの変更を加えた(そして例を追加した)ことをもう一度覚えておいてください。

struct TeamSelectView: View {
    @ObservedObject var trade = Trade(name: "Name", teamsSelected: [])
    @State var teams = [1, 1, 1, 1, 1]

    var body: some View {
        NavigationView{
            VStack{
                NavigationLink(destination: TradeView(trade: self.trade)) {
                    Text(self.trade.name)
                }

                List {
                    ForEach(self.teams, id: \.self) { team in
                        TeamRow(trade: self.trade)
                    }
                }
                Text("\(self.trade.teamsSelected.count)")
            }
            .navigationBarItems(trailing: Button("+", action: {
                self.teams.append(1)
            }))
        }
    }
}
struct TeamRow: View {
    @ObservedObject var trade: Trade

    var body: some View {
        Button(action: {
            self.trade.teamsSelected.append(1)
        }) {
            Text("Button")
        }
    }
}
struct TradeView: View {
    @ObservedObject var trade: Trade

    var body: some View {
        VStack {
            Text("\(self.trade.teamsSelected.count)")
            TextField("Trade Name", text: self.$trade.name)
                .textFieldStyle(RoundedBorderTextFieldStyle())
                .padding()
        }
    }
}

まず、を見てみましょう@State var teams。私たちは、使用@State-シンプルな値型のためIntString基本的なstructs-または単純な値型のコレクション。@ObservedObjectに準拠するオブジェクトに使用されますObservableObject。これは、Intまたはだけよりも複雑なデータ構造に使用されますString

気付くの@State var teamsは、teams押されたときに配列に新しいアイテムを追加するナビゲーションバーアイテムを追加したListことです。teams配列を反復処理することで生成されるため、ビューが再レンダリングされ、新しいアイテムがに追加されます。私達のListボタンが押されるたびに。これは、の使用方法の非常に基本的な例です@State

次に、があります@ObservedObject var trade。私が元々と違うことをしているわけではないことに気付くでしょう。私はまだTradeクラスのインスタンスを作成していて、そのインスタンスをビュー間で受け渡ししています。ただし、現在はObservableObject、を使用し@ObservedObjectているため、Tradeオブジェクトが変更されるたびにビューはすべてパブリッシャーイベントを受信し、それらの変更を反映するようにビューを自動的に再レン​​ダリングします。

最後に指摘したいのは、オブジェクトのプロパティを更新するためTextFieldに作成しTradeViewTradeものnameです。

TextField("Trade Name", text: self.$trade.name)

この$文字は、テキストフィールドにバインディングを渡していることを示しています。これは、加えた変更TextFieldがオブジェクトにname反映されることを意味しTradeます。@Bindingオブジェクト全体を渡さずにビュー間で状態を同期しようとしているときに、ビュー間でバインディングを渡すことができるプロパティを宣言することで、同じことを自分で行うことができます。

私はあなたTradeViewを取るように変更しましたが@ObservedObject var trade、あなたがバインディングを受け入れる限り、あなたはteamsSelectedこのようなバインディングとしてあなたのトレードビューに単に渡すことができTradeView(teamsSelected: self.$trade.teamsSelected)ますTradeViewTradeViewバインディングを受け入れるようにを構成するには、次のようにteamsSelectedプロパティを宣言するだけですTradeView

@Binding var teamsSelected: [Team]

最後@ObservedObjectに、物理デバイスでの使用で問題が発生した場合は、回避策として使用する方法の説明について、ここで私の回答を参照できます@EnvironmentObject

0
pipo92 2020-03-25 17:50.

まず、理解を深めてくれたgraycampbellに感謝します。しかし、私の理解は完全にはうまくいかないようです。少し違うケースがありますが、完全には解決できません。

私はすでに別のスレッドで質問をしましたが、それが何らかの形でトピックに適合しているので、ここにも追加したいと思います:SwiftUIのトグルのリストから値を読み取る

多分あなたたちの誰かがこれで私を助けることができます。最初のポストへの主な違いは、このトピックでは、私はそれぞれからデータを収集するために持っていること、である場合GameGenerationRowGameGenerationView、その後、別のビューにそれを手渡します。

0
hunter09h 2020-10-08 12:54.

@Bindingおよび@State/@PublishedをCombineで使用できます。つまり、@Binding子ビューのプロパティを使用して、次のように親ビューの@Stateまたは@Publishedプロパティにバインドします。

struct ChildView: View {
    @Binding var property1: String
    var body: some View {
        VStack(alignment: .leading) {
            TextField(placeholderTitle, text: $property1)
        }        
    }
}
struct PrimaryTextField_Previews: PreviewProvider {
    static var previews: some View {
        PrimaryTextField(value: .constant(""))
    }
}
struct ParentView: View{
    @State linkedProperty: String = ""
    //...
        ChildView(property1: $linkedProperty)
    //...
}

または@Publilshed、viewModel(@ObservedObject)にプロパティがある場合は、それを使用してChildView(property1: $viewModel.publishedProperty)。のように状態をバインドします。

Related questions

MORE COOL STUFF

「水曜日」シーズン1の中心には大きなミステリーがあります

「水曜日」シーズン1の中心には大きなミステリーがあります

Netflixの「水曜日」は、典型的な10代のドラマ以上のものであり、実際、シーズン1にはその中心に大きなミステリーがあります.

ボディーランゲージの専門家は、州訪問中にカミラ・パーカー・ボウルズが輝くことを可能にした微妙なケイト・ミドルトンの動きを指摘しています

ボディーランゲージの専門家は、州訪問中にカミラ・パーカー・ボウルズが輝くことを可能にした微妙なケイト・ミドルトンの動きを指摘しています

ケイト・ミドルトンは、州の夕食会と州の訪問中にカミラ・パーカー・ボウルズからスポットライトを奪いたくなかった、と専門家は言う.

一部のファンがハリー・スタイルズとオリビア・ワイルドの「非常に友好的な」休憩が永続的であることを望んでいる理由

一部のファンがハリー・スタイルズとオリビア・ワイルドの「非常に友好的な」休憩が永続的であることを望んでいる理由

一部のファンが、オリビア・ワイルドが彼女とハリー・スタイルズとの間の「難しい」が「非常に友好的」な分割を恒久的にすることを望んでいる理由を見つけてください.

エリザベス女王の死後、ケイト・ミドルトンはまだ「非常に困難な時期」を過ごしている、と王室の専門家が明らかにする 

エリザベス女王の死後、ケイト・ミドルトンはまだ「非常に困難な時期」を過ごしている、と王室の専門家が明らかにする&nbsp;

エリザベス女王の死後、ケイト・ミドルトンが舞台裏で「非常に困難な時期」を過ごしていたと伝えられている理由を調べてください.

セントヘレナのジェイコブのはしごを登るのは、気弱な人向けではありません

セントヘレナのジェイコブのはしごを登るのは、気弱な人向けではありません

セント ヘレナ島のジェイコブズ ラダーは 699 段の真っ直ぐ上る階段で、頂上に到達すると証明書が発行されるほどの難易度です。

The Secrets of Airline Travel Quiz

The Secrets of Airline Travel Quiz

Air travel is far more than getting from point A to point B safely. How much do you know about the million little details that go into flying on airplanes?

Where in the World Are You? Take our GeoGuesser Quiz

Where in the World Are You? Take our GeoGuesser Quiz

The world is a huge place, yet some GeoGuessr players know locations in mere seconds. Are you one of GeoGuessr's gifted elite? Take our quiz to find out!

バイオニック読書はあなたをより速く読むことができますか?

バイオニック読書はあなたをより速く読むことができますか?

BionicReadingアプリの人気が爆発的に高まっています。しかし、それは本当にあなたを速読術にすることができますか?

Total War:Warhammer:Kotakuレビュー

Total War:Warhammer:Kotakuレビュー

私はこのゲームを嫌う準備ができていました。先週の前に、Total War:Warhammerについての私の考えがありました:それでもここに私は、私の手にある完成品であり、私は変わった男です。

涙の道:軍事化された帝国主義勢力がスタンディングロックキャンプを占領

涙の道:軍事化された帝国主義勢力がスタンディングロックキャンプを占領

スタンディングロックスー族のメンバーと水の保護者は、ノースダコタ州のスタンディングロックにあるオセティサコウィンキャンプを去ります。(Twitter経由のCNNスクリーンショット)火と煙がスカイラインを覆い、スタンディングロックスー族のメンバーと水の保護者が、聖なるものを守りながら建てた家、オセティサコウィン(セブンカウンシルファイアーズ)キャンプから行進し、太鼓を打ち、歌い、祈りました。ダコタアクセスパイプラインとしても知られる「ブラックスネーク」からの土地。

シアーズとKマートはイヴァンカ・トランプの商品を自分たちで取り除いています

シアーズとKマートはイヴァンカ・トランプの商品を自分たちで取り除いています

写真:APシアーズとKマートは、イヴァンカ・トランプのトランプホームアイテムのコレクションも、誰も購入したくないために削除しました。シアーズとKマートの両方の親会社であるシアーズホールディングスは、土曜日のABCニュースへの声明で、彼らが気にかけていると辛抱強く説明しましたトランプラインを売り続けるにはお金を稼ぐことについてあまりにも多く。

ポテトチップスでたった10分でスペインのトルティーヤを作る

ポテトチップスでたった10分でスペインのトルティーヤを作る

伝統的なスペインのトルティーヤは通常、オリーブオイルで柔らかくなるまで調理されたポテトから始まります(30分以上かかる場合があります)が、ケトルで調理されたポテトチップスの助けを借りてわずか10分でテーブルに置くことができます。上のビデオはすべてがバラバラにならないように裏返す方法を含め、レシピ全体を説明しますが、必要なのは4〜5個の卵と3カップのケトルチップスだけです。

ケイト・ミドルトンとウィリアム王子は、彼らが子供たちと行っているスパイをテーマにした活動を共有しています

ケイト・ミドルトンとウィリアム王子は、彼らが子供たちと行っているスパイをテーマにした活動を共有しています

ケイト・ミドルトンとウィリアム王子は、子供向けのパズルの本の序文を書き、ジョージ王子、シャーロット王女、ルイ王子と一緒にテキストを読むと述べた.

事故で押しつぶされたスイカは、動物を喜ばせ水分補給するために野生生物保護団体に寄付されました

事故で押しつぶされたスイカは、動物を喜ばせ水分補給するために野生生物保護団体に寄付されました

Yak's Produce は、数十個のつぶれたメロンを野生動物のリハビリ専門家であるレスリー グリーンと彼女のルイジアナ州の救助施設で暮らす 42 匹の動物に寄付しました。

デミ・ロヴァートは、新しいミュージシャンのボーイフレンドと「幸せで健康的な関係」にあります: ソース

デミ・ロヴァートは、新しいミュージシャンのボーイフレンドと「幸せで健康的な関係」にあります: ソース

8 枚目のスタジオ アルバムのリリースに向けて準備を進めているデミ ロヴァートは、「スーパー グレート ガイ」と付き合っている、と情報筋は PEOPLE に確認しています。

Plathville の Kim と Olivia Plath が数年ぶりに言葉を交わすことへようこそ

Plathville の Kim と Olivia Plath が数年ぶりに言葉を交わすことへようこそ

イーサン プラスの誕生日のお祝いは、TLC のウェルカム トゥ プラスビルのシーズン 4 のフィナーレで、戦争中の母親のキム プラスと妻のオリビア プラスを結びつけました。

仕事の生産性を高める 8 つのシンプルなホーム オフィスのセットアップのアイデア

仕事の生産性を高める 8 つのシンプルなホーム オフィスのセットアップのアイデア

ホームオフィスのセットアップ術を極めよう!AppExert の開発者は、家族全員が一緒にいる場合でも、在宅勤務の技術を習得しています。祖父や曽祖父が共同家族で暮らしていた頃の記憶がよみがえりました。

2022 年、私たちのデジタル ライフはどこで終わり、「リアル ライフ」はどこから始まるのでしょうか?

20 年前のタイムトラベラーでさえ、日常生活におけるデジタルおよびインターネットベースのサービスの重要性に驚くことでしょう。MySpace、eBay、Napster などのプラットフォームは、高速化に焦点を合わせた世界がどのようなものになるかを示してくれました。

ニューロマーケティングの秘密科学

ニューロマーケティングの秘密科学

マーケティング担当者が人間の欲望を操作するために使用する、最先端の (気味が悪いと言う人もいます) メソッドを探ります。カートをいっぱいにして 3 桁の領収書を持って店を出る前に、ほんの数点の商品を買いに行ったことはありませんか? あなたは一人じゃない。

地理情報システムの日: GIS 開発者として学ぶべき最高の技術スタック

地理情報システムの日: GIS 開発者として学ぶべき最高の技術スタック

私たちが住んでいる世界を確実に理解するには、データが必要です。ただし、空間参照がない場合、このデータは地理的コンテキストがないと役に立たなくなる可能性があります。

Language