javascript - VueJS：动态设置组件的方法

Question

我有一个带有单页组件的 SPA 应用程序；我想根据我的路由名称为组件导入某些方法。如何在 Vue 中实现这一点？就像是：

<template>
    <div>
        <div v-for="foo in customMethod()">{{foo.bar}}</div>
    </div>
</template>

<script>
export default {
    methods: {},

    mounted: function() {
        switch(this.$route.name) {
            case "route.name":
                this.methods = require('./external-script.js');
                break;
            case "another.route.name":
                this.methods = require('./another-external-script.js');
                break;
        }
    }
}

</script>

标签： javascriptvue.jssingle-page-application

Answer 1

这种描述似乎是策略设计模式可以解决的问题，因为您需要根据路由名称采取不同的行为。看看这篇文章。如果这不是您的意图，您可以尝试 Vue动态组件。