可以把js中的对象转成url参数的函数介绍（代码实例）

这个函数呢是自己在写基于Vue+ElementUI管理后台时用到的,，下面列出来两种使用方式：

最普通的，封装一个js函数

 /**
 * 对象转url参数
 * @param {*} data
 * @param {*} isPrefix
 */
 urlencode (data, isPrefix) {
 isPrefix = isPrefix ? isPrefix : false
 let prefix = isPrefix ? '?' : ''
 let _result = []
 for (let key in data) {
 let value = data[key]
 // 去掉为空的参数
 if (['', undefined, null].includes(value)) {
 continue
 }
 if (value.constructor === Array) {
 value.forEach(_value => {
 _result.push(encodeURIComponent(key) + '[]=' + encodeURIComponent(_value))
 })
 } else {
 _result.push(encodeURIComponent(key) + '=' + encodeURIComponent(value))
 }
 }

 return _result.length ? prefix + _result.join('&') : ''
 }

在Vue组件化开发时，我是这样写的

utils.js文件

const utils = {
 /**
 * 对象转url参数
 * @param {*} data
 * @param {*} isPrefix
 */
 urlencode (data, isPrefix = false) {
 let prefix = isPrefix ? '?' : ''
 let _result = []
 for (let key in data) {
 let value = data[key]
 // 去掉为空的参数
 if (['', undefined, null].includes(value)) {
 continue
 }
 if (value.constructor === Array) {
 value.forEach(_value => {
 _result.push(encodeURIComponent(key) + '[]=' + encodeURIComponent(_value))
 })
 } else {
 _result.push(encodeURIComponent(key) + '=' + encodeURIComponent(value))
 }
 }

 return _result.length ? prefix + _result.join('&') : ''
 },

 // ....其他函数....

}

export default utils

main.js文件

import Vue from 'vue'
import App from './App.vue'
import utils from '@/utils/utils'

// ...其他代码...

Vue.prototype.$utils = utils

// ...其他代码...

在使用的时候可以这样写

// ....其他代码

this.$utils.urlencode(this.params)

// ...其他代码...