qs.parse()、qs.stringify()使用方法

1. 简介

• qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。

2. qs主要有两个方法 ：

• qs.parse()将URL解析成对象的形式

<!--作者：zhangfan
页面名称：qs.parse()、qs.stringify()使用方法--> 
<template>
  <div id="product-list-one">
    <button @click="qsParse()">执行qsParse</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";
export default {
  data() {
    return {
      url:
        "method=query_sql_dataset_data&projectId=85&appToken=7d22e38e-5717-11e7-907b-a6006ad3dba0"
    };
  },
  computed: {},
  methods: {
    qsParse() {
      console.log(this.$qs.parse(this.url));
    }
  }
};
</script>

<style scoped>
</style>

如上面代码所示,输出结果如下:

• qs.stringify()将对象 序列化成URL的形式，以&进行拼接

<!--作者：zhangfan
页面名称：qs.parse()、qs.stringify()使用方法--> 
<template>
  <div id="product-list-Two">
    <button @click="qsStringify()">执行qsStringify</button>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex";
export default {
  data() {
    return {
      obj: {
        method: "query_sql_dataset_data",
        projectId: 85,
        appToken: "7d22e38e-5717-11e7-907b-a6006ad3dba0"
      }
    };
  },
  computed: {},
  methods: {
    qsStringify() {
      console.log(this.$qs.stringify(this.obj));
    }
  }
};
</script>

<style scoped>
</style>