Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
【コネヒトマルシェオンライン】Vue3触ってみた
Search
yamashooooo
October 20, 2020
0
290
【コネヒトマルシェオンライン】Vue3触ってみた
yamashooooo
October 20, 2020
Tweet
Share
More Decks by yamashooooo
See All by yamashooooo
【PIXIV MEETUP 2023】ピクシブ決済基盤のフロントエンドを改善していく話
yamam00s
0
810
【mediba #developers_community】フロントエンドの フレームワーク事情2022
yamam00s
0
81
【BIT VALLEY -INSIDE- Vol.17】自作キーボード入門した話
yamam00s
0
1.1k
【Roppongi.vue #3】ユーザー数1500万人のサービスにNuxtを導入して嬉しかったこと
yamam00s
1
810
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
Agile that works and the tools we love
rasmusluckow
327
21k
Designing for Performance
lara
604
68k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
870
Code Reviewing Like a Champion
maltzj
520
39k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
0
47
[RailsConf 2023] Rails as a piece of cake
palkan
52
5k
Bash Introduction
62gerente
608
210k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
Done Done
chrislema
181
16k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
How to Think Like a Performance Engineer
csswizardry
20
1.1k
Transcript
Vue3৮ͬͯΈͨ ʲmedibaࣾ߹ಉษڧձʳ ίωώτϚϧγΣΦϯϥΠϯ
ࣗݾհ • Name: Shota Yamamoto • Twitter: @yamam00s • Company:
גࣜձࣾmedibaʢ2019/10 ೖࣾʣ • Team: ςΫϊϩδʔηϯλʔ Eng1G
auεϚʔτύεͷϑϩϯτࣄ • Nuxt.js • TypeScript • Vuex • Jest •
Storybook • etc…
ࠓճ৮ΕΔػೳ • CompositionAPI • Fragment • Suspense • v-model •
Teleport
Composition API
2.x·ͰͷOptions API
3.xͷ͔ΒͷComposition API
ϏδωεϩδοΫΛ ·ͱΊ͘͢ͳͬͨɻ Γग़͠Մೳɻ
None
MixinͰͰ͖ͨͷͰ🤔
Composition API vs Mixin Mixinͷා͍෦ • ໊લͷڝ߹࣌ͷڍಈ • ҉తͳґଘؔ •
ઇ่ࣜͳංେԽ
Mixin
Composition APIͰͷuseXXX
Fragment
2.x vs 3.x
ΧελϜίϯϙʔωϯτͷ ଐੑͷܧঝͲ͏ͳΔ͔
2.x vs 3.x
Suspense
ඇಉظͳίϯϙʔωϯτΛ TemplateͰ੍ޚͰ͖Δ
None
৽͍͠v-model
ΧελϜίϯϙʔωϯτͷ v-model͕ΑΓ͍͘͢ɺ ෳఆٛՄೳʹ
None
Teleport
ରͷηϨΫλʹૠೖ
·ͱΊ
ҰॹʹΩϟονΞοϓ ͍͖ͯ͠·͠ΐ͏ʂ
࠷ޙʹ medibaͰڞʹಇ͘ΤϯδχΞΛ ืू͍ͯ͠·͢ ͓͓ͪͯ͠Γ·͢ʂʂʂʂ
͋Γ͕ͱ͏͍͟͝·ͨ͠ 🙇