app-nav-pos.vue

<template>
    <div class="app-nav-pos">
        <template v-if="dynaNavMode === 'ROUTEVIEW'">
            <template v-if="enableCache">
                <app-keep-alive :routerList="routerList">
                    <router-view :key="routerViewKey"></router-view>
                </app-keep-alive>
            </template>
            <router-view v-else :key="routerViewKey"></router-view>
        </template>
        <component
            class="view-container2"
            v-if="navData && navData.navView"
            :is="navData.navView"
            :viewDefaultUsage="false"
            :viewdata="JSON.stringify(navData.srfnavdata.context)"
            :viewparam="JSON.stringify(navData.srfnavdata.viewparmas)"
            @viewdataschange="handleViewEvent"
            @viewLoaded="handleViewEvent"
            @viewstatechange="handleViewEvent">
        </component>
    </div>
</template>
<script lang="ts">
import { Component, Prop, Vue, Watch } from "vue-property-decorator";

@Component({})
export default class AppNavPos extends Vue {
    /**
     * 动态导航模式（DYNAMICCOMP：动态组件 ROUTEVIEW：路由出口）
     *
     * @public
     * @type {'DYNAMICCOMP' | 'ROUTEVIEW'}
     * @memberof AppNavPos
     */
    @Prop({ default: "ROUTEVIEW" }) public dynaNavMode?: "DYNAMICCOMP" | "ROUTEVIEW";

    /**
     * 是否启用动态缓存
     *
     * @type {boolean}
     * @memberof AppNavPos
     */
    @Prop({ default: false }) public enableCache?: boolean;

    /**
     * 导航数据
     *
     * @type {*}
     * @memberof AppNavPos
     */
    @Prop() public navData?: any;

    /**
     * 路由列表
     *
     * @memberof AppNavPos
     */
    get routerList() {
        return this.$store.state.historyPathList;
    }

    /**
     * 路由键值
     *
     * @memberof AppNavPos
     */
    get routerViewKey() {
        let _this: any = this;
        return _this.$route.fullPath;
    }

    /**
     * 执行视图事件
     *
     * @param {*} args
     * @memberof AppNavPos
     */
    public handleViewEvent(args: any) {
        console.log(args);
    }

}
</script>