javascript 在Vue.js中创建Axios / Json服务

Posted 2021-05-03

Create e new file src/service/serviceName.js

import axios from 'axios'
    
    const apiClient = axios.create({  
      baseURL: `http://localhost:3000`,
      withCredentials: false, // This is the default
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json'
      }
    })
    
    export default {
      getEvents() {
        return apiClient.get('/events')
      }
      getEvent(id) {
        return apiClient.get('/events/' + id)
      }
    }
    
-------------------- Import in another component 
import ServiceName from '@/services/ServiceName.js'

data() {
  return {
    event: {}
  }
},
created() {
        ServiceName.getEvent(this.id) // <--- Send the prop id to our EventService
          .then(response => {
            this.event = response.data
          })
          .catch(error => {
            console.log('There was an error:', error.response)
          })
      }