element plus 单选框点击跳转页面

Element Plus是一个Vue 3的UI组件库，它提供了一套简洁易用的界面组件。如果你想使用Element Plus的单选框（Radio）配合路由功能实现点击跳转页面，你可以按照以下步骤操作：

1. 首先，在你的项目中安装Element Plus，如果你还没有安装，可以在`main.js`或`app.vue`文件中通过npm或yarn引入并导入：

   npm install element-plus -S
   // 或者
   yarn add element-plus

2. 然后在模板中使用Element Plus的`el-radio`组件，并为其添加一个`@change`事件处理器，这个事件会在用户选择新的选项时触发：

   <template>
     <div>
       <el-radio-group v-model="selectedOption">
         <el-radio :label="option1" @change="jumpToPage">选项1</el-radio>
         <el-radio :label="option2" @change="jumpToPage">选项2</el-radio>
         <!-- 添加更多选项 -->
       </el-radio-group>
     </div>
   </template>

   <script setup>
   import { ref } from 'vue';
   const selectedOption = ref('');
   const option1 = "page1";
   const option2 = "page2"; // 这里是你要跳转的不同页面路径

   function jumpToPage(value) {
     router.push(`/your-route/${value}`); // 使用Vue Router跳转到对应的页面
   }
   </script>

3. 最后，确保你已经配置了Vue Router，如果是官方文档提供的基本设置，你需要导入`useRoute`或`router`变量，然后用`router.push`来导航：

   import { useRouter } from 'vue-router';

   // ...
   const router = useRouter();