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.4k
vuexとvue-routerとあれこれ
#aizu_fun_lt の資料です。
Tajima Sachiko
December 24, 2019
Tweet
Share
More Decks by Tajima Sachiko
See All by Tajima Sachiko
コンポーネントライブラリで実現する、アクセシビリティの正しい実装パターン
schktjm
3
1.1k
ゼロから始めるアクセシビリティ啓蒙活動
schktjm
2
2.8k
CLUB p1ass を作った
schktjm
0
240
はじめての npm パッケージ作り
schktjm
0
290
E2E テスト入門
schktjm
0
480
Firebaseでお手軽OGP生成
schktjm
0
610
3時間でつくるいいかんじのポートフォリオサイト
schktjm
1
390
秋の大LT2019 in Aizu
schktjm
0
130
Treasure体験記
schktjm
1
520
Other Decks in Programming
See All in Programming
効率的な開発手段として VRTを活用する
ishkawa
1
180
The Evolution of Enterprise Java with Jakarta EE 11 and Beyond
ivargrimstad
0
550
코딩 에이전트 체크리스트: Claude Code ver.
nacyot
0
1k
LLMは麻雀を知らなすぎるから俺が教育してやる
po3rin
2
1.3k
NEWT Backend Evolution
xpromx
1
160
脱Riverpod?fqueryで考える、TanStack Queryライクなアーキテクチャの可能性
ostk0069
0
570
React は次の10年を生き残れるか:3つのトレンドから考える
oukayuka
40
15k
なぜあなたのオブザーバビリティ導入は頓挫するのか
ryota_hnk
3
520
MySQL9でベクトルカラム登場!PHP×AWSでのAI/類似検索はこう変わる
suguruooki
1
250
11年かかって やっとVibe Codingに 時代が追いつきましたね
yimajo
0
210
マッチングアプリにおけるフリックUIで苦労したこと
yuheiito
0
250
AI コーディングエージェントの時代へ:JetBrains が描く開発の未来
masaruhr
2
220
Featured
See All Featured
Building an army of robots
kneath
306
45k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
How to Ace a Technical Interview
jacobian
278
23k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
54k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.3k
How STYLIGHT went responsive
nonsquared
100
5.7k
BBQ
matthewcrist
89
9.8k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Faster Mobile Websites
deanohume
308
31k
KATA
mclloyd
30
14k
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を深く理解できてよかったです
ありがとうございました!