Vue之beforeRouteEnter的使用

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);