source

vue에서 사용자 지정 클래스 인스턴스화

goodcode 2022. 7. 27. 23:59
반응형

vue에서 사용자 지정 클래스 인스턴스화

바벨과 웹팩으로 Vue를 배우려고 합니다.커스텀 클래스를 만들고 커스텀 컴포넌트로 Import를 이미 했습니다.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
}

제가 뭘 놓쳤나요, 아니면 수출이 잘못된 건가요?

이 코드에는 여러 가지 문제가 있습니다.

  1. Import에는 다음 항목을 사용할 필요가 없습니다..js

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


  1. 마지막에 괄호를 사용하여 클래스를 초기화합니다(이것은 상수입니다).

    const testData1 = new Data1();


  1. 오브젝트를 사용하지 않고 클래스를 내보낼 수 있습니다.

    export default Data1;

언급URL : https://stackoverflow.com/questions/51981994/instantiate-a-custom-class-in-vue

반응형