vue页面设置返回按钮
时间: 2023-08-17 14:12:35 浏览: 97
在Vue页面中设置返回按钮有多种方法。其中一种方法是在页面上添加一个返回按钮,并使用Vue Router的`router-link`组件来实现页面跳转。可以参考以下代码示例:
```html
<router-link class="mui-tab-item" :to="{ path: '/cms/page/list', query: { page: this.$route.query.page, siteId: this.$route.query.siteId } }">
<el-button type="primary" size="small">返回</el-button>
</router-link>
```
在上述代码中,我们使用了`router-link`组件来创建一个链接,通过`to`属性指定了跳转的路径和参数。在这个例子中,我们将跳转到`/cms/page/list`页面,并携带了`page`和`siteId`两个参数。
另外,你还可以在Vue组件中定义一个返回方法,并在需要返回的地方调用该方法来实现返回功能。可以参考以下代码示例:
```javascript
methods: {
goBack() {
this.$router.push({
path: '/cms/page/list',
query: {
page: this.$route.query.page,
siteId: this.$route.query.siteId
}
});
}
}
```
在上述代码中,我们定义了一个名为`goBack`的方法,通过`this.$router.push`方法来实现页面跳转。在需要返回的地方调用该方法即可返回到指定页面,并携带相应的参数。
请根据你的具体需求选择适合的方法来设置返回按钮。
阅读全文