如何实现vue获取url的参数

在Vue.js中，你可以通过JavaScript的内置方法来获取URL的查询参数。以下是一个简单的步骤：

1. 首先，在你的Vue实例中定义一个方法，通常我们会将其命名为`getQueryParams`，用于解析URL参数。

export default {
  data() {
    return {};
  },
  methods: {
    getQueryParams(queryString) {
      // 如果没有传递字符串，就获取当前页面的URL参数
      if (!queryString) queryString = window.location.search;

      // 将URL分割成查询字符串部分和路径部分
      const params = new URLSearchParams(queryString);

      // 返回一个对象，其中键值对是解析后的参数
      return Object.fromEntries(params.entries());
    }
  }
}

2. 调用这个方法时，传入你想要获取参数的部分，例如：

<script>
export default {
  computed: {
    queryParams() {
      return this.getQueryParams();
    }
  }
}
</script>

<!-- 在模板中使用 -->
<template>
  <div v-for="(param, value) in queryParams" :key="param">
    参数{{ param }} 的值是 {{ value }}
  </div>
</template>