网站开发的层级结构,贵阳中企动力做的网站,音乐主题的网站设计,重庆软件制作需求#xff1a;在修改商品时#xff0c;会进行页面跳转#xff0c;通过点击修改按钮进行页面跳转。这时我们需要将商品的id携带过去 一、首先我们在查询页面实现路由跳转并携带参数。 1.1、修改按钮 el-button typeprimary sizesmall click在修改商品时会进行页面跳转通过点击修改按钮进行页面跳转。这时我们需要将商品的id携带过去 一、首先我们在查询页面实现路由跳转并携带参数。 1.1、修改按钮 el-button typeprimary sizesmall clickedit(scope.row)修改/el-button 1.2、先在List展示表格的页面导入useRouter import { useRouter } from vue-router; 1.3、声明router const router useRouter(); 1.4、点击事件进行传参并跳转路由, 其中name是跳转页面的名字你在router里的index.ts中路由配置的name query是要传递的参数比如回显需要根据id查询对应的内容 //修改的点击事件 路由跳转
const edit (scope: any) {router.push({name: category-edit,query: { id: scope.id, name: category-edit },});
}; 1.5、 配置路由通过router.push()中的name就是查找路由配置然后实现跳转 {path: /category/edit,name: category-edit,component: () import(/views/category/Edit.vue),meta: { title: 分类编辑, icon: Setting, isShow: false },},
二、编辑页面接收查询页面的参数 2.1、在跳转过来的Edit页面导入useRoute import { useRoute } from vue-router; 2.2、声明route const route useRoute(); 2.3、使用参数 通过route打点调用属性就可以 route.query.id
