Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
vuexとvue-routerとあれこれ
Search
Tajima Sachiko
December 24, 2019
Programming
0
1.3k
vuexとvue-routerとあれこれ
#aizu_fun_lt の資料です。
Tajima Sachiko
December 24, 2019
Tweet
Share
More Decks by Tajima Sachiko
See All by Tajima Sachiko
ゼロから始めるアクセシビリティ啓蒙活動
schktjm
1
2.3k
CLUB p1ass を作った
schktjm
0
210
はじめての npm パッケージ作り
schktjm
0
260
E2E テスト入門
schktjm
0
440
Firebaseでお手軽OGP生成
schktjm
0
550
3時間でつくるいいかんじのポートフォリオサイト
schktjm
1
360
秋の大LT2019 in Aizu
schktjm
0
100
Treasure体験記
schktjm
1
460
Other Decks in Programming
See All in Programming
GenU導入でCDKに初挑戦し、悪戦苦闘した話
hideg
0
160
KSPの導入・移行を前向きに検討しよう!
shxun6934
PRO
0
280
Findy - エンジニア向け会社紹介 / Findy Letter for Engineers
findyinc
4
90k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
0
120
Securify_エンジニア採用資料
3shake
0
100
The Shape of a Service Object
inem
0
520
【TID2024】模擬講義:プログラマと一緒にゲームをデザインしてみよう!
akatsukigames_tech
0
660
Lessons by WebAssembly app in production on CDN Edge Computing Service
tetsuharuohzeki
0
210
connect-go で面倒くささと戦う / 2024-08-27 #newmo_layerx_go
izumin5210
2
650
僕が思い描くTypeScriptの未来を勝手に先取りする
yukukotani
9
2.4k
Ruby Parser progress report 2024
yui_knk
2
230
Understand the mechanism! Let's do screenshots tests of Compose Previews with various variations / 仕組みから理解する!Composeプレビューを様々なバリエーションでスクリーンショットテストしよう
sumio
3
790
Featured
See All Featured
The World Runs on Bad Software
bkeepers
PRO
64
11k
Designing the Hi-DPI Web
ddemaree
278
34k
Speed Design
sergeychernyshev
22
430
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
24
610
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
89
16k
It's Worth the Effort
3n
182
27k
Atom: Resistance is Futile
akmur
261
25k
Mobile First: as difficult as doing things right
swwweet
221
8.8k
Reflections from 52 weeks, 52 projects
jeffersonlam
346
20k
Building Flexible Design Systems
yeseniaperezcruz
325
38k
Side Projects
sachag
451
42k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
363
22k
Transcript
vuexとvue-router とあれこれ たじま ( @schktjm #aizu_fun_lt
メリークリスマス
今日言うこと - 自己紹介 - リロードの挙動とvuex - vuexのactionのエラーハンドリングの話 - 問題点 -
vue routerはすごい
自己紹介 - 田嶋幸智子 ( @schktjm - やってること - フロントエンド: Vue,
React, TS - 競プロ: 緑 - 好きなこと - スノボー - バイク
そもそも セッショントークンが切れている場合、読み込み時にAPIが401を返しなにも 見えないエラーが発生
そこで とりあえず、セッショントークンなど切れている場合ログイン画面に飛ばしたい。
App.vueのcreatedで トークンが無効 ↓ /login に飛ばす をするとエラーがconsoleに出力 されてしまう 改善案1
問題(再生できなかったらデモ
改善案2 vue-routerのナビゲーショ ンガード: 遷移時点( 画面が読み込ま れる前 ) でトークンが有効 かどうかを判定しログイン 画面に飛ばす。
実際のコード router/index.js
成功例 ( 再生でk(ry
そもそもの問題が 「リロード時にvuexのstoreの値が初期化されてしまう」から 始まった問題ですがvue-routerを深く理解できてよかったです
ありがとうございました!