#4 - Fetch products from API | Vuex State, Actions, & Mutations | Vuex state management tutorial
HTML-код
- Опубликовано: 6 ноя 2019
- In this video, we will fetch products from API and store that into Vuex state. In this video, you will learn Vuex state, actions, and mutations.
#VueJs #Vuex #VuexTutorial #Vue
𝐕𝐮𝐞𝐱 𝐭𝐮𝐭𝐨𝐫𝐢𝐚𝐥𝐬 (𝐕𝐮𝐞.𝐣𝐬 𝐒𝐭𝐚𝐭𝐞 𝐌𝐚𝐧𝐚𝐠𝐞𝐦𝐞𝐧𝐭) 𝐏𝐥𝐚𝐲𝐥𝐢𝐬𝐭
• Vuex tutorial (Vue.js ...
𝐆𝐢𝐭𝐡𝐮𝐛 𝐑𝐞𝐩𝐨𝐬𝐢𝐭𝐨𝐫𝐲:
github.com/qirolab/learn-vuex...
𝐕𝐮𝐞 𝟐 𝐁𝐚𝐬𝐢𝐜𝐬 𝐁𝐞𝐠𝐢𝐧𝐧𝐞𝐫 𝐓𝐮𝐭𝐨𝐫𝐢𝐚𝐥
• Vue 2 Basics Beginner ...
𝐕𝐮𝐞.𝐣𝐬 𝟐 𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬 𝐏𝐥𝐚𝐲𝐥𝐢𝐬𝐭:
• Vue.js 2 Components, B...
𝐃𝐢𝐠𝐢𝐭𝐚𝐥𝐎𝐜𝐞𝐚𝐧 𝐑𝐞𝐟𝐞𝐫𝐫𝐚𝐥
m.do.co/c/e740238537d0
Also, follow us on:
𝐅𝐚𝐜𝐞𝐛𝐨𝐨𝐤: qirolab
𝐓𝐰𝐢𝐭𝐭𝐞𝐫: / qirolab 
Наука
Brother, your video forced me to leave a comment. You have make you awesome by your tutorial . You description is very easy to understand. Thank you very much for you effort.
Really i also added a comment and subscribed for his effort
Good video: NICE!
INFO-FOR-VIEWERS: If you have the basic knowledge of the Vue JS, then this video is very very easy for you.
Thank you.
if we update the products from this page, say, like we have an AddProductPage which would in turn call post API, would the mounted() be triggered the next time we go to the index page and load the new product automatically?
Really good job :)
Thanks for the Video
Thank you! Cheers!
how to add vue dev tools tab while we choose inspect web?
good video, how i can add api calling "meta":{"currentPage":1,"hasNextPage":true,"perPage":10}
this is good project but we can get the api that make me stop pleace help me if you hear me iam work as frontend i neve work with laravel
When I get to the product page from the home list, it show all well, but if I do a refresh, it looks like it loses the state, it gets undefined and the page is empty. Can anyone help me?
hi, did you get this solution after refresh.
we can use ...mapState as well right .?
yes of course.
The reason I did not use here because I want to explain Vuex step by step. I will use mapState, mapGetters and mapActions in the coming videos.
Actually, I have already explained that in the first video of this series. Where the title is "Learn Vuex in 30 minutes" - ruclips.net/video/FIL0za5MzZA/видео.html
Error in mounted hook: "TypeError: Cannot read property 'dispatch' of undefined" i have this error, although i did everything like you, why in the video before you put import store from './store'; ? when all the info is in index? maybe you changed it and we didnt see?
I cannot tell the reason for "TypeError: Cannot read property 'dispatch' of undefined" without knowing what you have tried in your code. So, you need to explain what you have tried.
Second, you have asked about "import store from './store'; "
When the code is in the index file, then it is not required to specify the index file with directory name when you're importing that.
So following both will work:
"import store from './store';
"import store from './store/index';
May i ask why you getProduct
written in mutation?
If I understand correctly, mutations are for a change in data.
I thought it belonged to the getters.
Thx
Mutations are best and recommended place to change vuex state data. Because Mutations can communicate with Vue dev tool and helps in debugging.
On the other hand "getters" are to fetch data from Vuex state. It is same as computed property of Vue.
@@QiroLab THis Questions ask in interview
what is this terminal?
I am using oh-my-zsh on my Terminal. You can learn about it from this video: ruclips.net/video/ANxLmiLXtFM/видео.html
hey bro !! i'm vietnamese , i very like this video. You can give me this link api ?? thank you .
Check this Github repository: github.com/qirolab/learn-vuex-with-basic-ecommerce-example
It has Laravel app used as API in this tutorial.