vue の get method\post メソッドはどのようにして配列パラメーターを渡すことができますか?

1 vueのgetメソッドで配列パラメータを渡す方法

配列をオブジェクトに直接渡す

export function getCrApplicationList(data) {
  var test = [‘111‘, ‘222‘]
  return request({
    url: ‘/applicant/CrApplication/List‘,
    method: ‘get‘,
    params: { test }
  })
}

ただし、この場合、背景は値を取得できないため、配列を次の形式に変更する必要があります。

テスト:111

テスト:222

最初に axios.js を見つけて、次のコードを追加します。

if (config.method === ‘get‘) {
    // 如果是get请求,且params是数组类型如arr=[1,2],则转换成arr=1&arr=2
    config.paramsSerializer = function(params) {
      return qs.stringify(params, { arrayFormat: ‘repeat‘ })
    }
  }

get リクエストのパラメーターが配列形式の場合、配列内の各項目の属性名が再利用されます。

同様に、このメソッドは、post メソッドが get メソッドのパラメーター形式を渡すときによく使用されます。

カプセル化されたインターフェース部分:

/**
 * @description 以post请求方式,传递array[]数组
 * @param {Array[integer]} idList
 * @param {integer} orderId
 * @return {*}
 */
export function doFuncTest(idListVal, orderId) {
    return request({
        url: '/xxxx/xxx',
        method: 'post',
        baseURL: '//192.168.xxx.xxx:xxxx/xxx/xxx/xxx',
        params: {
            idList: idListVal,
            orderId: orderId
        }
    })
}

インターセプター部分:

if (config.method === 'post') {
    config.paramsSerializer = function(params) {
        return qs.stringify(params, { arrayFormat: 'repeat' })
    }
}

2. Vue の get および post パラメータ転送メソッド

vueのカプセル化インターフェースでpostとgetのパラメータ渡し方が違う

2.1投稿: データでパラメーターを渡す

/**
 * 添加动物种类
 * @param {*} params 
 * @returns 
 */
export function AddAnimalType (params) {
  return request({
    url: baseUrl + '/addAnimalType',
    method: 'post',
    data: params
  })
}

呼び出しコード:

次の this.formData には、 data で定義されたリストに id などの情報が含まれています

    //新增
    insertAnimalType () {
      AddAnimalType(this.formData).then(response => {
        if (response.status == 0) {
          successMessage(response.statusText)
        }
        else {
          errMessage(response.statusText)
        }
      }).catch(error => {
        errorCollback(error)
      })
    },

2.2 get: params でパラメーターを渡す

/**
 * 根据Id获取详情
 * id id
 * @param {*} params 
 * @returns 
 */
export function selectById (params) {
  return request({
    url: baseUrl + '/selectById',
    method: 'get',
    params
  })
}

呼び出しインターフェイス:

    //获取详情
    getDetail () {
      selectById({ animalId: this.formData.id }).then(response => {
        if (response.status == 0) {
          this.formData = response.data.animalType
        }
        else {
          errMessage(response.statusText)
        }
      }).catch(error => {
        errorCollback(error)
      })
    },

おすすめ

転載: blog.csdn.net/qq_34936893/article/details/128873473