Question

我将Vue.js用于MVVM项目，我想尽可能地分离View和ViewModel以实现代码可维护性和测试。这是我的Example.vue文件：

<template>
    <div>
        <h1>Example: {{message}}</h1>
    </div>
</template>
<script>
require('../ViewModels/Example');
export default {
    data() {
        return new Example();
    }
}
</script>

然后是Example.js文件：

class Example {
    constructor() {
        this.message = "Hello World";
    }
}

但我得到一个错误：＆＃34; ReferenceError：未定义示例＆＃34; 如果我将Example类粘贴到我的脚本标记中它可以正常工作，但是当我尝试导入或要求它不起作用时。任何人都知道为什么？

Answer 1

我明白了。我需要以特定的方式导入和导出，所以我的Example.vue：

<template>
    <div>
        <h1>Example: {{message}}</h1>
    </div>
</template>

<script>
    import Example from '../ViewModels/Example';

    export default {
        data() {
            return new Example();
        }
    }
</script>

和我的Example.js类文件：

export default class Example {
    constructor() {
        this.message = "Hello World";
    }
}

我可以在Vue.js中为ViewModel要求/导入文件吗？

1 个答案: