[220526] vue payload

- vue

member 은 변수와 메소드를 포함한 개념

 

- payload.amount 

payload의 데이터타입은? 객체!

내장메소드가 아닌 이상 점표기법으로 나타낸 객체!

 

- createApp

 

- todo API

import {createStore} from 'vuex'
import axios from 'axios'

const END_POINT = 'https://asia-northeast3-heropy-api.cloudfunctions.net/api/todos'
const headers = {
  //특수기호가 있는 속성은 따옴표를 넣는다
  "content-type": "application/json",
  apikey: "FcKdtJs202204",
  username: "KDT2_KimMyeongJin"
}


export default createStore ({

state(){
  return{
    todos: []
  }
},
mutations: {
  setTodos(state,payload){
    state.todos = payload
  }
},
actions: {
  async readTodos({commit}){
    const res = await axios({
      url: END_POINT,
      method: 'GET',
      headers
    })
    console.log(res)
    commit('setTodos',res.data)
  },
  async createTodo(context, title){
    const res = await axios({
      url: 'https://asia-northeast3-heropy-api.cloudfunctions.net/api/todos',
      method: 'POST',
      headers: {
        //특수기호가 있는 속성은 따옴표를 넣는다
        "content-type": "application/json",
        apikey: "FcKdtJs202204",
        username: "KDT2_KimMyeongJin"
      },
      data: {
        title
      }
    })
    // console.log(res)
  }
}
})