How to define the relationship in vuex's state

169abc470372d3972631198c35737350?s=47 Tetsuya Tatsumi
March 09, 2018
Programming
1
260

How to define the relationship in vuex's state

When you use vuex state, how to define relationship between state objects?

169abc470372d3972631198c35737350?s=128

Tetsuya Tatsumi

March 09, 2018
Tweet

More Decks by Tetsuya Tatsumi

See All by Tetsuya Tatsumi
169abc470372d3972631198c35737350?s=48 dokechin
0
39
169abc470372d3972631198c35737350?s=48 dokechin
1
160
169abc470372d3972631198c35737350?s=48 dokechin
0
140
169abc470372d3972631198c35737350?s=48 dokechin
0
260
169abc470372d3972631198c35737350?s=48 dokechin
0
850

Other Decks in Programming

See All in Programming
70adfe7679427fa498899769e632b672?s=48 itok
1
170
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
300
Fa5fd3405808cc6a9fe4b126b1ec39bd?s=48 gianarb
0
410
9da5d5cc4b6a9f28058152e28364b02a?s=48 prof18
1
120
60a71672b538fb50cc1d15c41c971255?s=48 blackbing
0
130
C6296f654b1cc6886aabe5b9703cbe67?s=48 ishiitetsuji
1
560
7e0087a19318ded4ba2203187694740f?s=48 christianweyer
0
130
E35e0e7d3f6105befd7096b7ee558911?s=48 nishikawasasaki
0
480
51f4d2341131b6b9bfa996bdb9b8dfa8?s=48 showmant
3
280
841002bf24bb562253de7eb3c17ceae6?s=48 kyomo
1
150
7e0087a19318ded4ba2203187694740f?s=48 christianweyer
0
190
49833977598de9524fa85cacb93a42ce?s=48 philcalcado
0
110

Featured

See All Featured
B47b288784fda77a94aeb234ca743c24?s=48 keavy
105
14k
7c8469ee8c9e594c65c59b919626c08d?s=48 scottboms
250
11k
B83d5b590577969ee79a5ad845411a7d?s=48 ammeep
653
54k
3d6ace9554821d552146413bcdf874f6?s=48 trishagee
14
940
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
51
4k
9fa239b3154a0169d99ab7bf1422dd12?s=48 marcelosomers
220
14k
1177e050db6bafe62885362edf6e3537?s=48 lauravandoore
8
1.1k
C1daf20e5c49ff910745198ef9869ac2?s=48 hatefulcrawdad
257
16k
9128d500301ae51524e887bb680f471d?s=48 caitiem20
304
17k
Bfd6b681ec6e8c9bef82ff0521c364f7?s=48 kastner
52
1.8k
C9b18d9dff88a9dd2393364c2b3b21bd?s=48 colly
65
2.9k
24fc194843a71f10949be18d5a692682?s=48 gr2m
82
11k

Transcript

  1. )PXUPEFpOFUIF SFMBUJPOTIJQJOWVFYT TUBUF (PUBOEBKTJO/FYUCFBU !EPLFDIJO

  2. ˏEPLFDIJO w .JEEMF"HFENBOXIPMJLFTUPNBLFXFC BQQMJDBUJPO CVUUFDIOPMPHZMFWFMJTʜ

  3. *NQMFNFOUJOH8FC "QQMJDBUJPOGPSQFSTPOBMVTF w 7VF w 7VFY w WVFDMJ w 7VFUJGZ

  4. 7VFY It serves as a centralized store for all the

    components in an application

  5. .PEFM ΠΦϯ ͓٬༷ײँσʔ ͋Γ͕ͱ͏σʔ ΠτʔϤʔΧಊ ϋοϐʔσʔ

  6. %FpOFSFMBUJPOTIJQCZ SFGFSFODF TUBUF\ TIPQT<BFPO ZPLBEP>  EJTDPVOUT< \OBNFb͓٬༷ײँσʔ` TIPQBFPO^ 

    \OBNFb͋Γ͕ͱ͏σʔ` TIPQBFPO^  \OBNFbϋοϐʔσʔ` TIPQZPLBEP^ > ^

  7. %FpOFSFMBUJPOTIJQCZ*% TUBUF\ TIPQT<\JE OBNFbΠΦϯ`^  \JE OBNFbϤʔΧಊ`^>  EJTDPVOUT< \OBNFb͓٬༷ײँσʔ`

    TIPQ@JE^  \OBNFb͋Γ͕ͱ͏σʔ` TIPQ@JE^  \OBNFbϋοϐʔσʔ` TIPQ@JE^ > ^

  8. (FUUJOHTIPQOBNFGSPN EJTDPVOU w EJTDPVOUTIPQOBNF w HFU4IPQ#Z*E EJTDPVOUTIPQ@JE OBNF 3FGFSFODFɹ *%ɹ

  9. 3FGFSFODFXBZ w 6OEFSTUBOEBCMFDPEF w /PHFUUFSSFRVJSFE

  10. 4UBUFQFSTJTUFODF QSPCMFN

  11. 6TJOH-PDBM4UPSFHF BTTUBUFTUPSF

  12. 3FGFSFODFPCKFDUJT SFQMBDFEUPWBMVF TUBUF\ TIPQT<\OBNFbBFPO`^ \OBNFbZPLBEP`^>  EJTDPVOUT< \OBNFb͓٬༷ײँσʔ` TIPQ\OBNFbBFPO`^^ 

    \OBNFb͋Γ͕ͱ͏σʔ` TIPQ\OBNFbBFPO`^^  \OBNFbϋοϐʔσʔ` TIPQ\OBNFbZPLBEP`^^ > ^

  13. 3FGFSFODFSFDPOTUSVDUJT OFFEFE var storage = JSON.parse localStorage.getItem bkey' var shops

    = new Map storage.shops.map i => <i.id i> for var discount of storage.discounts { discount.shop = shops.get discount.shop.id } this.replaceState Object.assign state storage

  14. $PODMVTJPO w 3FMBUJPOTIJQTPGNFNCFSTPG4UBUFDBOCF SFQSFTFOUFEVTJOHSFGFSFODFT w #VUDPOTJEFSBUJPOGPSQFSTJTUFODFTUPSFJT OFDFTTBSZ