beforeRouteEnter用于路由跳转后进入新的页面进行操作,由于<script setup>里面没有内置beforeRouteEnter的语法,所以需要另外写一个<script>标签。
下面代码是beforeRouteEnter的使用示例,从from可以获得跳转页面前的路由信息。
<script>
import { defineComponent } from "vue";
const backHref = ref("");
const mainHrefArr = ["/main", "/newMain"];
export default defineComponent({
beforeRouteEnter(to, from, next) {
if (mainHrefArr.includes(from.path)){
backHref.value = from.path;
}
next();
},
});
</script>
根据跳转前页面的信息设置好返回路由后,点击返回按钮即可往回跳转。
const onClickLeft = () => router.push(backHref.value);