axios 시 뮬 레이 션 POST 요청 (분리 쓰기 유지 보수 에 유리)

3771 단어 vue
1、axios.js    :
import axios from 'axios'
export const instance = axios.create({

  // basic url
  baseURL: 'http://192.166.0.132:9999/txapi',

  //          'timeout'       
  timeout: 3000,

  // withCredentials '           '
  //withCredentials: true,

  //headers: { 
        "Content-Type": "application/x-www-form-urlencoded", 
        "Access-Token": "84c6635800b14e0eba4f7ece65e095a1" 
    }
  headers: { "Content-Type": "application/x-www-form-urlencoded" },  
  // 1、        :application/x-www-form-urlencoded

})

2、api.js    :
//           axios.js
import {instance} from './axios.js'
import qs from 'qs'

export function getMessage (param) {
  return instance({
    method: 'GET',
    url: '/storage',
    params: param
  })
}

export function addMessage (param) {
  return instance({
    method: 'POST',
    url: '/storage/',
    //          ,post       params  ,       ,   axios 
    //            params data  ,        ,    。  params 
    //    url        ,  get  。 data       (body)  ,   post  。
    // params: param
    data: qs.stringify( param )   //    :    POST  data,GET  params
  })
}

3、Test.vue    :



    import axios from 'axios'
    // 1、  qs axios          form-data  (   axios ,      )
    import qs from 'qs'
    import {getMessage} from './api.js'
    import {addMessage} from './api.js'
    export default {
        name: "Test",

        data () {
          return {
            title: '  Test  !!!',
            msg:'',
            // getImgUrl: 'http://192.166.0.132:9999/txapi/storage/?roomid=1',
            param_get: {
              roomid: '1'
            },

            param_post: {
              roomid: '6',
              content: 'wocalei'
            }

          }
        },

        methods: {
          get: function() {
              axios.get("http://192.166.0.132:9999/txapi/storage/", {
                  params: this.param_get
              }).then(res => {
                  this.msg = res.data
              })
              .catch((error) => {
                  this.msg = error
              })
          },

          separate_get() {
              getMessage(this.param_get).then((res) => {
                  this.msg = res.data
              })
              .catch((error) => {
                  this.msg = error
              })
          },

          post: function() {
            axios.post(
                "http://192.166.0.132:9999/txapi/storage/",
                // 2、        form-data  
                qs.stringify(this.param_post),
                // 3、     Content-Type
                { headers:{'Content-Type':'application/x-www-form-urlencoded'} },
            ).then(res => {
              this.msg = res.data
            })
            .catch((error) => {
              this.msg = error
            })
          },

          separate_post() {
            addMessage(this.param_post).then((data) => {
              this.msg = data.data
            })
              .catch((error) => {
                this.msg = error
              })
          },


        }

    }





좋은 웹페이지 즐겨찾기