Fetch blog by Id Edit Page > Fetch 사용법

pages/instructor/blog/_id/edit.vue

@@ -57,10 +57,19 @@
 import Editor from '~/components/editor'
 import Header from '~/components/shared/Header'
 import Modal from '~/components/shared/Modal'
+import { mapState } from "vuex";
 export default {
   layout: 'instructor',
   components: {
     Editor, Header, Modal
+  },
+  computed : {
+    ...mapState({
+      blog: ({instructor}) => instructor.blog.item
+    })
+  },
+  async fetch({params, store}){
+    await store.dispatch('instructor/blog/fetchBlogById', params.id)
   }
 }
 </script>

store/instructor/blog.js

@@ -1,5 +1,5 @@
 export const state = () => ({
-
+  item: {}
 })
 
 export const actions = {
@@ -12,9 +12,23 @@ export const actions = {
     } catch (error) {
       return error
     }
+  },
+  async fetchBlogById({commit}, blogId) {
+    try {
+      console.log('instructor/blog.js actions fetchBlogById call axios.$get->blogId')
+      const blog = await this.$axios.$get(`/api/v1/blogs/${blogId}`)
+      console.log('instructor/blog.js actions fetchBlogById done axios.$get->blogId')
+      console.log('courses.js mutations call setBlog')
+      commit('setBlog', blog)
+      console.log('courses.js mutations done setBlog')
+    } catch (error) {
+      return error
+    }
   }
 }
 
 export const mutations = {
-
+  setBlog(state, blog) {
+    state.item = blog
+  }
 }