---
title: Async
tags:  #スターください #swift #swiftui  
author: [bannzai](https://www.docswell.com/user/bannzai)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/Y76NKPG67V.jpg?width=480
description: エンジニアと人生コミュニティで発表したスター乞食になっております
published: December 17, 22
canonical: https://www.docswell.com/s/bannzai/K87VYZ-2022-12-17-220705
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/Y76NKPG67V.jpg)

SwiftUI x Concurrency をよ
り簡単に
bannzai \(^o^)/


# Page. 2

![Page Image](https://bcdn.docswell.com/page/G755PKV574.jpg)

みなさん


# Page. 3

![Page Image](https://bcdn.docswell.com/page/9J2N6W3GER.jpg)

こう思ったことはないだろうか


# Page. 4

![Page Image](https://bcdn.docswell.com/page/DEYP9L1GEM.jpg)

async/await 便利


# Page. 5

![Page Image](https://bcdn.docswell.com/page/VJN5L42878.jpg)

一方、こう思ったことはないだろうか


# Page. 6

![Page Image](https://bcdn.docswell.com/page/YE9Y4Q1XJ3.jpg)

もっと楽したいぴょん


# Page. 7

![Page Image](https://bcdn.docswell.com/page/GE86QG497D.jpg)

ここで普段書くようなコードを見てみよう


# Page. 8

![Page Image](https://bcdn.docswell.com/page/LEL9XG6MJR.jpg)

struct UserView: View {
@State var user: User?
@State var error: Error?
var body: some View {
Group {
if let user {
Text(user.name)
} else if let error {
ErrorPage(error: error)
} else {
ProgressView()
}
}
.task {
await fetch()
}
}
private func fetch() async {
do {
user = try await apiClient.fetch(path: &quot;user&quot;)
} catch {
self.error = error
}
}
}


# Page. 9

![Page Image](https://bcdn.docswell.com/page/4JMZLQ56EW.jpg)

struct UserView2: View {
@StateObject var viewModel = UserViewModel()
var body: some View {
Group {
if let user = viewModel.user {
Text(user.name)
} else if let error = viewModel.error {
ErrorPage(error: error)
} else {
ProgressView()
}
}
.onAppear {
viewModel.fetch()
}
}
}
final class UserViewModel: ObservableObject {
@Published var user: User?
@Published var error: Error?
func fetch() {
Task { @MainActor in
do {
user = try await apiClient.fetch(path: &quot;user&quot;)
} catch {
self.error = error
}
}
}
}


# Page. 10

![Page Image](https://bcdn.docswell.com/page/PJR6K83N79.jpg)

同じパターンだぴょん


# Page. 11

![Page Image](https://bcdn.docswell.com/page/PEXML8487X.jpg)

パターン
1. Viewの宣言に必要な状態は、値が無ければ読み込み中,
値が存在すればメインコンテンツの表示、エラーならエ
ラーの表示
2. .onAppear(もしくは.task)で値を引っ張ってくる


# Page. 12

![Page Image](https://bcdn.docswell.com/page/3EKGLKZLJD.jpg)

課題
- 同じようなコードを書く。do{}catch{}とかも
- 同じようなコードに保ちたい。if let は書き忘れがありそう


# Page. 13

![Page Image](https://bcdn.docswell.com/page/L73N3ZD675.jpg)

赤枠の部分が書き忘れ発生しそうなので
書き忘れが無いように制約をつけたい
struct UserView: View {
@State var user: User?
@State var error: Error?
var body: some View {
Group {
if let user {
Text(user.name)
} else if let error {
ErrorPage(error: error)
} else {
ProgressView()
}
}
.task {
await fetch()
}
}
private func fetch() async {
do {
user = try await apiClient.fetch(path: &quot;user&quot;)
} catch {
self.error = error
}
}
}


# Page. 14

![Page Image](https://bcdn.docswell.com/page/87DW4RPMJG.jpg)

作るぴょん


# Page. 15

![Page Image](https://bcdn.docswell.com/page/VJP9MWNQE8.jpg)

できた


# Page. 16

![Page Image](https://bcdn.docswell.com/page/2EVM98KPEQ.jpg)

スターください


# Page. 17

![Page Image](https://bcdn.docswell.com/page/57GGZ5QQ7L.jpg)

Async
https://github.com/bannzai/Async


# Page. 18

![Page Image](https://bcdn.docswell.com/page/4EQXLZKW7P.jpg)

みなさんがスターをくれるまで待ちます
Async
https://github.com/bannzai/Async


# Page. 19

![Page Image](https://bcdn.docswell.com/page/KJ46D3P171.jpg)

struct UserView3: View {
@Async&lt;User&gt; var async
var body: some View {
switch async(fetch).state {
case .success(let user):
Text(user.name)
case .failure(let error):
ErrorPage(error: error)
case .loading:
ProgressView()
}
}
private func fetch() async throws -&gt; User {
try await apiClient.fetch(path: &quot;user&quot;)
}
}


# Page. 20

![Page Image](https://bcdn.docswell.com/page/LE1VZ1957G.jpg)

struct UserView4: View {
var body: some View {
AsyncView(fetch, when: (
success: { user in
Text(user.name)
},
failure: { error in
ErrorPage(error: error)
},
loading: {
ProgressView()
}
))
}
private func fetch() async throws -&gt; User {
try await apiClient.fetch(path: &quot;user&quot;)
}
}


# Page. 21

![Page Image](https://bcdn.docswell.com/page/GEWL98QW72.jpg)

最高だぴょん


# Page. 22

![Page Image](https://bcdn.docswell.com/page/47ZM98W2E3.jpg)

スターください


# Page. 23

![Page Image](https://bcdn.docswell.com/page/YJ6NKPX6JV.jpg)

おしまい \(^o^)/


