VUEX的简单使用

福尔摩斯对我笑 2019-05-29 12317 次 3773条

/ state,驱动应用的数据源;
// view,以声明方式将 state 映射到视图;
// actions,响应在 view 上的用户输入导致的状态变化。


const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment: state=> state.count ++ ,
    decrement: state=> state.count--
  },
  // Action 提交的是 mutation,而不是直接变更状态。
  actions: {
    increment (context, seek){
      console.log(seek);
      context.commit('increment')
    }
  }
})



  new Vue({
    el: '#app',
    // computed : {
    //   count(){
    //     // return store.state.count
    //     // console.log(this.$store.state);
    //     return this.$store.state.count
    //   }
    // },
    //映射
    computed: new Vuex.mapState({
      count: state => state.count,
      countAlisa: 'count', //好像是别名
      countPlusLocalState (state) {
        return state.count + this.localCount
      }
    }),
    
    store,
    methods: {
      increment (){
          // store.commit('increment')
          store.dispatch('increment', 'seek') // 派发触发-》actions-》mutaions , action 内部可以执行异步
      },
      decrement (){
        store.commit('decrement')
      }
    }
  })


  // store.state 来获取状态对象
  // store.commit 方法触发状态变更
  // 再次强调,我们通过提交 mutation 的方式,而非直接改变 store.state.count,是因为我们想要更明确地追踪到状态的变化。这个简单的约定能够让你的意图更加明显,这样你在阅读代码的时候能更容易地解读应用内部的状态改变。此外,这样也让我们有机会去实现一些能记录每次状态改变,保存状态快照的调试工具。有了它,我们甚至可以实现如时间穿梭般的调试体验。


  // mapState 辅助函数 当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题,我们可以使用 mapState 辅助函数帮助我们生成计算属性,让你少按几次键:



// store.state.count= 10
store.commit('increment')
console.log(store.state.count)

See the Pen
vuex的简单使用
by SeekHappy (@Mister-weizhuang)
on CodePen.

标签: 无

非特殊说明,本博所有文章均为博主原创。

头像也是LOGO
未来博客 博主大人
到了这个年纪,不应该再彷徨!

发表评论



 


已有 3773 条评论 1


  1. erotic

    An impressive share! I’ve just forwarded this onto a co-worker who had been doing a little research on this. And he actually ordered me lunch due to the fact that I discovered it for him… lol. So allow me to reword this…. Thank YOU for the meal!! But yeah, thanx for spending some time to talk about this topic here on your web site.

    回复 2020年2月26日
  2. TamuQQ

    I couldn’t resist commenting. Exceptionally well written!

    回复 2020年2月26日
  3. fuck

    Great post! We are linking to this great content on our website. Keep up the good writing.

    回复 2020年2月26日
  4. damn

    This website definitely has all the info I needed concerning this subject and didn’t know who to ask.

    回复 2020年2月26日
  5. Cheap towing

    Hi, after reading this awesome paragraph i am too glad to share my knowledge here with mates.

    回复 2020年2月26日
  6. web site

    I’ve been exploring for a little for any high quality articles or blog
    posts on this sort of area . Exploring in Yahoo I ultimately stumbled upon this web site.
    Reading this information So i am satisfied to show that I have a very just
    right uncanny feeling I discovered just what I needed.
    I so much without a doubt will make certain to do not omit this site and give it a
    look regularly.

    回复 2020年2月26日
  7. fuck you

    I seriously love your blog.. Excellent colors & theme. Did you make this site yourself? Please reply back as I’m planning to create my own blog and want to find out where you got this from or just what the theme is called. Many thanks!

    回复 2020年2月26日
  8. homoerotic

    I couldn’t refrain from commenting. Well written!

    回复 2020年2月26日
  9. motherfuck

    I like looking through a post that will make men and women think. Also, thank you for allowing for me to comment!

    回复 2020年2月26日
  10. Pierwsza klasakontaminacja szamb betonowych

    Hi, Neat post. There is a problem along with your site in internet explorer, may check this?
    IE still is the marketplace leader and a big component to
    people will omit your magnificent writing due to this problem.

    回复 2020年2月26日
  11. motherfuck

    This is a very good tip particularly to those fresh to the blogosphere. Short but very accurate information… Many thanks for sharing this one. A must read post!

    回复 2020年2月26日
  12. motherfuck

    You ought to take part in a contest for one of the highest quality blogs on the web. I am going to recommend this web site!

    回复 2020年2月26日
  13. 남원출장가격(카톡: Mo46)〖m oo27.c0M〗콜걸만남릉콜걸샵Y♂♔2019-02-19-07-13남원♩AIJ﹄출장여대생 출장업소출장아가씨♞안마-미시출장안마┼남원

    Excellent blog you’ve got here.. It’s hard to find quality writing like yours nowadays. I seriously appreciate people like you! Take care!!

    回复 2020年2月26日
  14. suck

    Hi! I just want to give you a huge thumbs up for your excellent information you have got here on this post. I will be coming back to your web site for more soon.

    回复 2020年2月26日
  15. search engine submission software

    You actually make it seem so easy with your
    presentation but I find this topic to be really something
    which I feel I would by no means understand. It seems too complex
    and extremely vast for me. I’m looking ahead on your next publish, I will
    try to get the cling of it!

    回复 2020年2月26日
  16. xxx free porn movies

    I do not know whether it’s just me or if everyone else encountering problems with your website.
    It appears as though some of the text in your posts are running
    off the screen. Can somebody else please provide feedback and let me know if this is happening to them as well?
    This might be a problem with my web browser because I’ve had
    this happen previously. Cheers

    回复 2020年2月26日
  17. motherfucker

    Greetings! Very helpful advice within this article! It’s the little changes that will make the greatest changes. Thanks for sharing!

    回复 2020年2月26日
  18. xxx free porn movies

    Thank you for any other fantastic article. Where else may anyone get that kind
    of info in such a perfect approach of writing?
    I’ve a presentation next week, and I’m at the search for such information.

    回复 2020年2月26日
  19. drug testing locations

    Excellent post. I was checking constantly this
    blog and I’m impressed! Extremely helpful info particularly the last part 🙂
    I care for such information much. I was looking for this particular
    info for a very long time. Thank you and good luck.

    回复 2020年2月26日
  20. webcam

    Very good post. I’m facing some of these issues as well..

    回复 2020年2月26日
  21. 샌즈카지노

    Gosh, now I sound like an alcoholic saying I’ve gone off the wagon.
    At the least the videos are free. I have not spent a cent but on something
    I’ve read or listened to. I’ve downloaded some audio books from the library. https://uricasino369.com/

    回复 2020年2月26日
  22. 샌즈카지노

    Gosh, now I sound like an alcoholic saying I’ve gone off the wagon. At the least the videos are free.
    I have not spent a cent but on something I’ve read or listened to.

    I’ve downloaded some audio books from the library. https://uricasino369.com/

    回复 2020年2月26日
  23. sex

    It’s hard to find experienced people on this subject, but you sound like you know what you’re talking about! Thanks

    回复 2020年2月26日
  24. eudoraspender.wordpress.com

    When I originally commented I clicked the “Notify me when new comments are added”
    checkbox and now each time a comment is added I get several emails with the same comment.
    Is there any way you can remove people from that service? Thank you!

    回复 2020年2月25日
  25. erect

    Greetings! Very helpful advice within this post! It’s the little changes that produce the most important changes. Thanks for sharing!

    回复 2020年2月25日
  26. toko kosmetik terdekat

    Spot on with this write-up, I actually feel this site
    needs much more attention. I’ll probably be back again to
    read more, thanks for the info!

    回复 2020年2月25日
  27. galvanized tension control bolts

    Hey there! I could have sworn I’ve been to this site before but after checking through some of the post I realized it’s new to me. Nonetheless, I’m definitely delighted I found it and I’ll be book-marking and checking back frequently!

    回复 2020年2月25日
  28. cgsptbp

    cialis without a prescription is there a generic for cialis [url=https://cialismtr.com/#]otc cialis[/url] how much does cialis cost cialis coupons <a href="https://cialismtr.com/#">cialis over the counter at walmart</a> cialis price costco generic cialis 2019

    回复 2020年2月25日
  29. טכנאי מזגנים בראשון לציון

    I’m glad I recently found your article about choosing an HVAC contractor.
    I absolutely agree that stability available with the contractor is an effective sign the contractor
    is progressing an excellent job. Yes, HVAC system will be the the most expensive equipment that my better half bought for home, so it can be crucial for individuals to simply start
    using a reputable HVAC company. Our heating system is not going to produce enough heat anymore,
    that is causing lots of discomfort into the house.
    I’m looking to pinpoint a contractor that has been in the
    business forever because right now, their experience in handling
    repairs are extensive and reliable. I’ll be sure to consider every one of your useful information on HVAC contractor.

    回复 2020年2月25日
  30. 카지노

    My partner and I stumbled over here different website and thought I might as well check things out.
    I like what I see so now i’m following you. Look forward to going over your web page repeatedly.

    回复 2020年2月25日
  31. fuckhole

    Good post. I learn something totally new and challenging on sites I stumbleupon every day. It’s always exciting to read articles from other authors and use a little something from other websites.

    回复 2020年2月25日
  32. modern era construction

    My partner and I stumbled over here different web page and thought I should check things out. I like what I see so now i’m following you. Look forward to finding out about your web page for a second time.

    回复 2020年2月25日
  33. נערות ליווי

    Feeling lonely? You lacked love and some touch? Escort women can enjoy
    your time. Many men utilize the services of escort girls.
    Therefore if you feel lonely? Lacking you adore and a little touch?
    On the website you’ll find escort women who can appreciate your time.

    The site doesn’t suggest the behave of prostitution , the website does not support
    the promotion of prostitutes in Israel, the advertisers undertake to provide medical erotic rub services only.
    The website Sex Center, Subtle Apartments – on the Pave Escort Portal 5Escortgirls Escort girls website for many different relationship for
    just about any purpose.

    回复 2020年2月25日
  34. a325n tc bolts

    Hmm it appears like your site ate my first comment (it was extremely long) so I guess I’ll just sum it up what I had written and say, I’m thoroughly enjoying your blog. I too am an aspiring blog writer but I’m still new to the whole thing. Do you have any tips for newbie blog writers? I’d genuinely appreciate it.

    回复 2020年2月25日
  35. juridiskt magasin

    fantastic post, very informative. I ponder why the opposite experts
    of this sector don’t realize this. You must continue your writing.
    I am sure, you have a huge readers’ base already!

    回复 2020年2月25日
  36. erect

    Saved as a favorite, I love your website!

    回复 2020年2月25日
  37. hard core

    I enjoy reading a post that will make men and women think. Also, thanks for allowing for me to comment!

    回复 2020年2月25日
  38. lexus888 mobile Version

    I’m gone to say to my little brother, that he should also pay
    a quick visit this web site on regular basis to take updated from newest information.

    回复 2020年2月25日
  39. 007카지노

    しっかり~
    オキテー ( -ω-)ノ☆(*_ _)バシィッ w
    それでなくても春はボーっとするよね https://securec52.ezhostingserver.com/veraclassifieds-com/author/niklasbreil/

    回复 2020年2月25日
  40. bastard

    Having read this I believed it was really enlightening. I appreciate you finding the time and energy to put this informative article together. I once again find myself spending way too much time both reading and posting comments. But so what, it was still worth it!

    回复 2020年2月25日
  41. Franklyn

    Hello! This is my first visit to your blog!
    We are a team of volunteers and starting a new initiative in a community in the same niche.

    Your blog provided us valuable information to work on. You have done
    a extraordinary job!

    回复 2020年2月25日
  42. Meilleur matelas 2020

    This excellent website certainly has all the information I
    needed concerning this subject and didn’t know who to
    ask.

    回复 2020年2月25日
  43. 코인카지노

    happy faces at 2019 SEADC

    We would like to share with you more joyful photos from the event when Southeast
    Asia practitioners (sangha) came together to find the
    happiness that comes from inside our own mind…. … http://daaisha.hk/types-of-subwoofer-audio-cable/

    回复 2020年2月25日
  44. 코인카지노

    happy faces at 2019 SEADC

    We would like to share with you more joyful photos from
    the event when Southeast Asia practitioners (sangha) came together to
    find the happiness that comes from inside our own mind….
    http://daaisha.hk/types-of-subwoofer-audio-cable/

    回复 2020年2月25日
  45. homoerotic

    Way cool! Some extremely valid points! I appreciate you writing this post and the rest of the site is also really good.

    回复 2020年2月25日
  46. anus

    Good day! I just would like to give you a big thumbs up for the great info you have right here on this post. I will be returning to your website for more soon.

    回复 2020年2月25日