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.js ≒ react
Search
Kaneko Takeshi
December 13, 2019
Technology
0
19
vue.js ≒ react
Kaneko Takeshi
December 13, 2019
Tweet
Share
More Decks by Kaneko Takeshi
See All by Kaneko Takeshi
オープンソースライセンスについて勉強する定期
tkckaneko
0
13
Eye Tracking on the Browser
tkckaneko
0
72
IEEE754を完全に理解した
tkckaneko
1
51
CSSのトレンドをみんなで見よう -2021年-
tkckaneko
0
72
多分これが一番早いと思います
tkckaneko
0
23
暗黒面の話
tkckaneko
0
14
CSR / SSR / SSG / JAMstack
tkckaneko
0
51
BOLT
tkckaneko
0
11
CSS Logical Properties and Values
tkckaneko
0
24
Other Decks in Technology
See All in Technology
LLM評価の落とし穴~開発者目線で気をつけるポイント~
rishigami
11
3.3k
Money-saving tips for the frugal serverless developer
theburningmonk
1
360
エンジニアゼロの組織から内製開発の DX をどう実現したのか / How did we achieve DX in in-house development in an organization with zero engineers?
genkiogasawara
7
3k
B2C、B2B プロダクトマネジメントの違い(および思考の罠) / B2C, B2B PM and reduction fallacy
ykmc09
5
2.4k
技術力の伸ばし方を考える
khirata
0
140
本番環境で Cloudflareを 使ってみた話
miu_crescent
2
130
Google Cloud Next '24 Recap in ZOZO AIにより変わる開発 運用/Development and operation changed by AI
gachimuchiengineer
0
200
生成AI活用推進の為にやったこと/やらなかったこと
ktc_wada
0
180
OPENLOGI Company Profile
hr01
0
46k
Cloudflare WorkersがPythonに対応したので試してみた
miura55
0
190
テストコードを書きながらCompose Multiplatformを乗りこなす
subroh0508
0
140
AWS CLIの起動が重くてつらいので aws-sdk-client-go を書いた / kamakura.go#6
fujiwara3
6
3.3k
Featured
See All Featured
Unsuck your backbone
ammeep
664
57k
Rails Girls Zürich Keynote
gr2m
91
13k
Testing 201, or: Great Expectations
jmmastey
30
6.4k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
14
8.4k
The Power of CSS Pseudo Elements
geoffreycrofte
62
5k
10 Git Anti Patterns You Should be Aware of
lemiorhan
649
58k
Designing Experiences People Love
moore
136
23k
Side Projects
sachag
451
41k
Rebuilding a faster, lazier Slack
samanthasiow
74
8.3k
Learning to Love Humans: Emotional Interface Design
aarron
267
39k
Stop Working from a Prison Cell
hatefulcrawdad
266
19k
Optimizing for Happiness
mojombo
370
69k
Transcript
vue.js ≒ react
vue.jsはreact
component vue.js <p v-if="isActive">Paragraph</p> react {isActive && <p>Paragraph</p>}
component vue.js <li v-for="item in items" :key="item.key"> {{ item.title }}
</li> react {items.map(item => ( <li key={item.key}>{item.title}</li> ))}
component vue.js <p v-show="isShow">paragraph</p> react <p style={{display: isShow ? 'initial'
: 'none'}}> paragraph </p>
component vue.js <p :class="{'active': isActive}">Paragraph</p> react ・・・
component vue.js <p v-html="Paragraph"></p> react <p dangerouslySetInnerHTML={{__html: 'Paragraph'}} />
component vue.js <button @click.prevent="handleClick"> Send </button> react <button onClick={handleClick}>Send</button>
ステート管理 vue.js data() { return {count: 0} } react const
[count, setCount] = useState(0);
DOM参照 vue.js <div ref="target">...</div> react const target = useRef(); return
( <div ref={target}>...</div> );
算出プロパティ vue.js computed: { fullName() { return `${this.firstName} ${this.lastName}`; }
}
算出プロパティ react const [firstName, setFirstName] = useState("John"); const [lastName, setlastName]
= useState("Doe"); const getFullName = () => `${firstName} ${lastName}`; const fullName = useMemo(getFullName, [firstName, lastName]);
監視プロパティ vue.js watch: { name(newVal, oldVal) {} } react ・・・
vue.jsはreact