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
Vue入門3日目くらいに知りたかったことたち
Search
ひさだ
July 12, 2019
Programming
0
320
Vue入門3日目くらいに知りたかったことたち
2019/07/12のVue.js Nightで発表した内容です。
ひさだ
July 12, 2019
Tweet
Share
More Decks by ひさだ
See All by ひさだ
FlutterのWebViewを使った
hisada
0
57
Other Decks in Programming
See All in Programming
[SF Ruby, March 2024] Rails on Wasm
palkan
0
370
両面どころかインフラもTSでできるよ ~ 全方位TypeScriptによるプロダクト開発 ~
myfinder
9
3.2k
コーンフレークから始める モデリング会話入門
ogurotakayuki
0
280
1BRC--Nerd Sniping the Java Community
gunnarmorling
0
300
Folding Cheat Sheet #2
philipschwarz
PRO
0
110
try! Swift Tokyo 2024 参加報告 / try! Swift Tokyo 2024 Report
hironytic
0
170
1인 개발자로 행복하게 살기 - GDG 송도 헬로월드 2024
benjaminkim
1
5.6k
プールにゆこう
irof
2
120
VSCodeでのDatabricks開発もお勧めしたい/I would also recommend Databricks development with VSCode.
kazumain
0
230
puregoの活用例
aethiopicuschan
0
220
Ruby Pattern Matching
bkuhlmann
0
920
Rails と人魚の話/rails-and-mermaid
sanfrecce_osaka
0
100
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
119
16k
Design by the Numbers
sachag
274
18k
Web Components: a chance to create the future
zenorocha
304
41k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
219
21k
A designer walks into a library…
pauljervisheath
199
23k
The Brand Is Dead. Long Live the Brand.
mthomps
48
28k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
5
1.5k
Fashionably flexible responsive web design (full day workshop)
malarkey
397
65k
Documentation Writing (for coders)
carmenintech
59
3.9k
We Have a Design System, Now What?
morganepeng
42
6.7k
The Illustrated Children's Guide to Kubernetes
chrisshort
28
46k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
13
1.5k
Transcript
!IJTBEB@EFW ೖ͘Β͍ʹ Γ͔ͨͬͨ͜ͱͨͪ ͻͩ͞
ࣗݾհ wͻͩ͞ w5XJUUFS!IJTBEB@EFW wઐֶߍੜ !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
w$ISPNF֦ு w։ൃʹศརͳػೳ 7VFKT%FWUPPMT !IJTBEB@EFW
7VFKT%FWUPPMT w ίϯϙʔωϯτͷ֊ߏ w QSPQT DPNQVUFE EBUB FUDʜ w 7VFYͷTUBUF
HFUUFST w DPNNJUཤྺͱͦͷϖΠϩʔυ w Πϕϯτൃੜཤྺ w 3PVUFSؔ࿈ w ύϑΥʔϚϯεใ !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
σʔλͷྲྀΕ w7VFKTͰࢠڙ͕͋ͳͨΛݟΔʂ w'PSNTͱ͔ !IJTBEB@EFW ࢠ ͪΐ͏͍ͩ ͍
σʔλͷྲྀΕ w7VFKTͰࢠڙ͕͋ͳͨΛݟΔʂ w7VFKTͱ͔ !IJTBEB@EFW ࢠ ࢲͷΛݟͳ͍͞ ͍
σʔλͷྲྀΕ wߋ৽ʁ w'PSNTͱ͔ !IJTBEB@EFW ࢠ ͰΛ͜͏ ߋ৽͞ΕͨΑ
σʔλͷྲྀΕ wߋ৽ʁ w7VFKTͱ͔ !IJTBEB@EFW ࢠ ྃղɺมߋޙͷ ࢲΛݟͳ͍͞ ͜ͷΛ͜Εʹߋ৽ ͯ͠΄͍͠ͳ
ΠϕϯτͰ ߋ৽ͯ͠΄͍͠Λ͑Δ
σʔλͷྲྀΕ wࢠ͕࣋ͭJOQVUͷΛʹ͢ʹ wQSPQTͰ͔ΒΛड͚औ͓ͬͯ͘ wJOQVU͕ߋ৽͞ΕͨΒ ΠϕϯτͰʹߋ৽Λཁ͢Δ wͦͷΠϕϯτΛݟͯΛߋ৽ !IJTBEB@EFW
σʔλͷྲྀΕ wࢠ͕࣋ͭJOQVUͷΛʹ͢ʹ wQSPQTͰ͔ΒΛड͚औ͓ͬͯ͘ wJOQVU͕ߋ৽͞ΕͨΒ ΠϕϯτͰʹߋ৽Λཁ͢Δ wͦͷΠϕϯτΛݟͯΛߋ৽ !IJTBEB@EFW ΊΜͲ͍
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
WNPEFM wࠓͷྲྀΕΛ؆୯ʹॻ͚Δ wWNPEFMҎԼͷ͜ͱΛ͢Δ wQSPQͷWBMVFʹࢦఆ͞Εͨ Λ͢ wJOQVUΠϕϯτ͕ग़ͨΒࢦఆ͞Εͨ มʹߋ৽ޙͷΛೖΕΔ !IJTBEB@EFW มߋՄ
WNPEFM wු͔Ϳٙ wଙཁૉʹೖͬͯΔJOQVU͕΄͍͠ʜ wWNPEFMͷWNPEFM͕͍ͨ͠ !IJTBEB@EFW
WNPEFM wࢠཁૉͷWNPEFMʹ͢Λ DPNQVUFEʹ͢Δ wHFUUFSͱTFUUFSΛఆٛ͠ɺ TFUUFSͰΠϕϯτΛൃੜͤ͞Δ !IJTBEB@EFW ࢠ ଙ ͜͜ͷ
WNPEFM // propsʹvalue͕͋Γɺ // ͜ͷཁૉͷࢠͷv-modelʹcomputedValueΛࢦఆ͢Δ computed: { computedValue: { get()
{ return this.value }, set(value) { this.$emit(‘input’, value); } } } !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
7VFTFU wྻΦϒδΣΫτͷཁૉʹ ೖ͢Δͱ7VFʹݕ͞Εͳ͍ •array[0] = ‘hogehoge’ // NG •Vue.set(array, 0,
‘hogehoge’) // OK wΦϒδΣΫτୈೋҾʹจࣈྻ !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
7VFY w7VFYܰʹಋೖ͢Δ͖ wWNPEFM͕͋Δͱ͍͑ɺ શ෦͔Β͢ͷ͖͍ͭ w"1*ΞΫηεΛBDUJPOͰΔͱૉఢ !IJTBEB@EFW
࣍ w7VFKT%FWUPPMT wσʔλͷྲྀΕ wWNPEFM w7VFTFU w7VFY w7VFYHFUUFS !IJTBEB@EFW
(FUUFS7VFY wʮ(FUUFSʜ Α͘Θ͔ΒΜޙͰʯ w݁ہޙͰॻ͖ͨ͠ wศརͩͬͨέʔεΛ͝հ !IJTBEB@EFW
(FUUFS7VFY !IJTBEB@EFW IPHF GVHB GPP CBS IPHF GVHB GPP CBS
IPHF GVHB GPP CBS IPHF GVHB GPP CBS IPHF GVHB GPP CBS ΞϓϦέʔγϣϯ ෦ʹσʔλΛ࣋ͪ ঢ়ଶʹΑͬͯ ͦͷҰ෦Λදࣔ͢Δ ෦ͷσʔλͱݱࡏදࣔ͢ΔॴΛTUBUFͰ࣋ͭ ݱࡏͷσʔλΛऔಘ͢ΔHFUUFSΛఆٛ ॴͷTUBUFΛߋ৽͢Δ͚ͩͰද͕ࣔมΘΔʂ
!IJTBEB@EFW ͓͠·͍