Question

我正在尝试通过Babel和Webpack学习Vue。我创建了一个自定义类，并且已经在我的自定义组件中进行了导入，这应该可以正常工作，因为我可以console.log它了吗？当然，它在日志中只是废话，但是当我尝试实例化它时，vue崩溃了。

这是组件文件中的代码。

<script>
    import Data1 from '../model/Data1.js';

    let testData1 = new Data1();

    console.log(Data1);
    console.log("test");


    export default {
        name: 'Test2',
        props: {
            msg: String,
            test: String,
        },
        data: function () {

            return {
                Data2: ["1", "2"],
                OK: true,
                testData1: testData1,
            }
        }
    }
</script>

这是我的自定义课程

class Data1 {
    constructor() {
        this.myArray = ["a", "b", "c"];
    }
}

export default {
    Data1
}

我错过了什么吗，还是出口错了？

Answer 1

此代码中存在多个问题。

导入不需要使用.js

import Data1 from '../model/Data1';

初始化一个类，该类的末尾带有方括号（并且是const）

const testData1 = new Data1();

您可以在不使用对象的情况下导出类。

export default Data1;

在vue中实例化自定义课程

1 个答案: