【RuoYi】实现二级页面跳转

一、前言

    在我们写项目的时候，很多时候都会用到二级页面的跳转，RuoYi框架中也不例外，RuoYi虽然前端用的是vue，但是因为其有权限设置，在实现二级页面跳转的时候和普通的页面跳转有所区别，博主这里进行记录，方便后期的后顾，也希望能对屏幕前的小伙伴们有所帮助。

二、实现过程

假设我们已经有了一张student表的CRUD操作，如图所示：

现在，我们要实现通过点击”按钮“实现页面的跳转操作，让我们来看看在RuoYi中如何操作。

①创建跳转页面

跳转页面的内容根据自己的需求设定，我这里是做测试就做个简单的内容，只要页面能跳过去就行。

②配置路由

配置跳转到familyDetail页面的路由，如下所示

③跳转方法

方法跳转如下：

④效果

三、总结

     虽然，我这里使用的案例比较简单，但是在RuoYi中二级页面的跳转是使用非常频繁的。其实就像上述的案例所示，当跳转到”familyDetail“页面后，还可以通过

this.$route.params.参数名称

获取传递到”familyDetail“页面的参数，此时就可以根据我们自己的需求来完成一些数据的查询、显示等操作。

    好啦！这篇博客就到这里了，如果有所帮助，别忘了，点赞、关注支持一波博主哦~