最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

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

来源:动视网 责编:小采 时间:2020-11-27 19:30:32
文档

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

可以把js中的对象转成url参数的函数介绍(代码实例):本篇文章给大家带来的内容是关于可以把js中的对象转成url参数的函数介绍(代码实例)),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。这个函数呢是自己在写基于Vue+ElementUI管理后台时用到的,下面列出来两种使用方式:最普通的,封装
推荐度:
导读可以把js中的对象转成url参数的函数介绍(代码实例):本篇文章给大家带来的内容是关于可以把js中的对象转成url参数的函数介绍(代码实例)),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。这个函数呢是自己在写基于Vue+ElementUI管理后台时用到的,下面列出来两种使用方式:最普通的,封装


本篇文章给大家带来的内容是关于可以把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,将其作为工具包引入Vue的main.js,并将其附给Vue原型,这样在每个组件中就可以使用this.$utils来使用里面的一些工具函数了

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)

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

文档

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

可以把js中的对象转成url参数的函数介绍(代码实例):本篇文章给大家带来的内容是关于可以把js中的对象转成url参数的函数介绍(代码实例)),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。这个函数呢是自己在写基于Vue+ElementUI管理后台时用到的,下面列出来两种使用方式:最普通的,封装
推荐度:
标签: 里面的 js 对象
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top