props怎么接收 vuerouter的query参数

在Vue组件中，你可以使用`props`属性来接收Vue Router的查询参数（query参数）。通过将`props`设置为`true`，你可以将查询参数作为组件的属性进行接收。

以下是一个示例：

export default {
  props: {
    id: {
      type: String,
      default: ''
    },
    imageId: {
      type: String,
      default: ''
    },
    name: {
      type: String,
      default: ''
    },
    tagsCount: {
      type: Number,
      default: 0
    }
  },
  mounted() {
    console.log(this.id, this.imageId, this.name, this.tagsCount);
  }
}

在上面的示例中，我们定义了与查询参数相对应的props，然后在mounted钩子中打印了这些props。

然后，你需要配置Vue Router来将查询参数传递给该组件。在路由定义中，使用`props: true`来启用props。

const routes = [
  {
    path: '/versionList',
    name: 'versionList',
    component: VersionListComponent,
    props: true
  }
];

现在，当你访问`/versionList?id=123&imageId=456&name=test&tagsCount=5`时，这些查询参数将被传递给VersionListComponent组件，并作为props进行接收。

请注意，使用props的方式只适用于查询参数，不适用于路由参数（params参数）。对于路由参数，你仍然需要使用`this.$route.params`来获取值。