2017-10-23 6 views
0

私はこの構文を使ってES6でクラスをインポートして初期化しようとしています。しかし、コンソールには「未定義のプロパティhej」と表示されます。このエラーの原因となっていただきましたインポートクラスがES6の構文で失敗する

Work.js

class Work { 

    constructor() { 

    } 

    hej() { 
     alert('hej'); 
    } 
} 

export default Work; 

Main.js

import Work from './modules/work.js'; 


Work.hej(); 

?どのようにそれを解決するには?

答えて

3

Workの機能には、hejというプロパティがありません。 hejnew Workはそう、インスタンスに割り当てますプロトタイプのプロパティです:

const w = new Work(); 
w.hej(); 

それとも、それstatic作り、はWork.hej();としてそれを使用したい場合:

class Work { 
    static hej() { 
// ^^^^^^----------------- 
     alert("hej"); 
    } 
} 

その後Work.hej()作品hejは静的メソッド(Workのメソッドであり、のインスタンスではないのうちWorkではないため)です。


あなたはクロームの最新バージョンにthis plunkrを使用している場合、それは(インスタンスメソッドで)働いていることを示します。ここでは、ソースです:

index.html

<!DOCTYPE html> 
<html> 

    <body> 
    <script type="module" src="work.js"></script> 
    <script type="module" src="main.js"></script> 
    </body> 

</html> 

work.js

class Work { 
    constructor() { 
    } 

    hej() { 
     document.body.appendChild(
      document.createTextNode("hej") 
     ); 
    } 
} 
export default Work; 

main.js

import Work from './work.js'; 

const w = new Work(); 
w.hej(); 

あなたはを使用している場合Chromeの最新バージョンのでは、動作していることが示されます(静的メソッドを使用)。

index.html(同上)

work.js

class Work { 
    constructor() { 
    } 

    static hej() { 
     document.body.appendChild(
      document.createTextNode("hej") 
     ); 
    } 
} 
export default Work; 

main.js:ここではソースだ

import Work from './work.js'; 

Work.hej(); 

注Chromeでそのモジュールのサポートは本当に新しいです、あなたは完全に最新のものにする必要があります(私がこれを書いているように、2017年10月下旬)。

+0

ありがとう、ありがとう。 hejをメソッドにしたいのですが?私の意図と同じです。 – user2952238

+0

@ user2952238:私はそのオプションを検討して編集していたはずであることを認識しました。ヒットリフレッシュ。 :-) –

+0

hm、次に私はこれを得ます:_work2。デフォルトはコンストラクタではありません – user2952238

関連する問題