javascript - VueJS : dynamically set component's methods

标签 javascript vue.js single-page-application

我有一个带有单页面组件的 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>

最佳答案

这个描述看起来像是策略设计模式可以解决的问题,因为你需要根据路由名称采取不同的行为。看看这个post 。如果这不是你的本意,你可以尝试 Vue dynamic components .

关于javascript - VueJS : dynamically set component's methods,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60224234/

相关文章:

javascript - 循环函数和数组: javascript

javascript - touchevent在手机浏览器中的相对位置

vue.js - 绑定(bind)到 getter 的计算属性在从 Vuex 状态对象中按键删除项目时不会更新

javascript - Angularjs - 将服务作为 Controller 参数传递导致错误

angular - 从共享文件夹导入 Angular 自定义管道时出错

javascript - Ruby on Rails - 渲染 JSON

javascript - React 从显示错误的状态创建 JSX

vue.js - Vue js 输入掩码

laravel 和 vuejs - 您是否正确注册了组件?对于递归组件,请确保提供 "name"选项。在发现

c# - 如何在同一项目中的asp.net mvc Controller 中从asp.net web api获取数据