vue3获取router-link参数

在Vue3中，要从`router-link`组件中获取动态路由参数，你可以通过访问`$route`对象来实现。`$route`是Vue Router提供的全局实例属性，包含了当前路由的信息，包括路径、查询参数等。

获取`router-link`的参数通常有两种情况：

1. **动态路由参数**：
当你使用`<router-link :to="{ name: 'yourRouteName', params: { paramKey: 'paramValue'}}">...</router-link>`，可以在组件内通过`this.$route.params.paramKey`来获取`paramKey`对应的值。

2. **查询参数**：
如果是通过查询字符串传递参数，如`<router-link to="/users?search=John">...</router-link>`，则可以使用`this.$route.query.search`来获取`search`键的值。

// 示例
export default {
  setup() {
    const searchParam = ref(this.$route.query.search); // 使用ref包装以便观察变化

    onMounted(() => {
      console.log('搜索参数:', searchParam.value);
    });

    return () => {
      // 渲染时动态显示参数
      <p>搜索参数: {searchParam}</p>
    };
  }
}