インポートした ES6 モジュールの関数が onclick イベントで定義されていないのはなぜですか?

ES6 モジュール: インポート後の未定義の Onclick 関数

ES6 では、モジュールは名前空間の競合を防ぐために個別のスコープを確立します。 onclick を使用してモジュールからインポートされた関数をバインドしようとすると、「ReferenceError: hello が定義されていません」エラーが発生する場合があります。この記事では、この問題の解決策を説明します。

解決策 1: addEventListener を使用する

モジュールにインポートされた関数の onclick イベントを処理するには、addEventListener を利用します。次の例を考えてみましょう。

<button type="button">

解決策 2: Window オブジェクトに関数を公開する (非推奨)

グローバル スコープの競合の可能性があるため推奨されませんが、インポートされた関数を window オブジェクトに公開することもできます:

import {hello} from './test.js'
  
window.hello = hello

これにより、関数内でグローバルに関数にアクセスできるようになります。アプリケーション。

以上がインポートした ES6 モジュールの関数が onclick イベントで定義されていないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。