Storybook: @ storybook / html 5.0.1は、ストーリーの読み込み時にスクリプトを実行できません。別名「DOMContentLoaded」は機能しなくなりました

作成日 2019年03月15日 · 6コメント · ソース: storybookjs/storybook

みなさん、こんにちは！だから、これが私の状況です：私のコンポーネントのいくつかはjavascriptを必要とします。 preview-head.html javascriptファイルを正常に呼び出すことができますが、初期化には問題があります。

v5.0.1より前は、次のものがありました。

document.addEventListener("DOMContentLoaded", function(event) {
        /* The stuff I needed to initialise */
    }, false);

動作しましたが、現在は動作しません。

私はあなたのドキュメントとStackoverflow自体をずっと調べてきましたが、これに対する解決策を見つけることができません。 Storybookが考慮すべきことのように感じます。

どんな助けでもいただければ幸いです。

core has workaround question / support

ソース

BennyZ28

最も参考になるコメント

@ BennyZ28解決策は何でしたか？

回避策は複雑すぎます。ストーリーがDOMツリーに追加された直後に呼び出されるコールバックをストーリーブックが提供しないのはなぜですか？

vipcxj 2020年04月04日

👍17

全てのコメント6件

気にしない、解決した

BennyZ28 2019年03月15日

@ BennyZ28解決策は何でしたか？

shilman 2019年03月15日

👍1

@shilman実際、私はそれを解決していません。画面の前で何時間も過ごした後、私は

だから、どんな助けでもまだ感謝しています！

BennyZ28 2019年03月15日

'page'が変更されるたびに、 iframe内の古いdiv#root要素が削除され、新しい要素が追加されます。この機能を使用してMutationObserverと組み合わせると、ページが変更されるたびに関数を実行できます。

preview-head.html 、次のものを追加できます。

function runOnInit() {
  console.log('Init')
}
function runOnPageChange() {
  console.log('Page has changed!')
}
document.addEventListener('DOMContentLoaded', function() {
  runOnInit();
  const callback = function(mutationsList) {
    for (let i = 0, len = mutationsList.length; i < len; i++) {
      if (mutationsList[i].type == 'childList') {
        runOnPageChange();
        break;
      }
    }
  };

  const observer = new MutationObserver(callback);
  const config = { childList: true, subtree: false };
  observer.observe(document.getElementById('root'), config);
}, false);

MutationObserverどのように機能するかを理解するには、 MDNドキュメントを参照してください。

d4nyll 2019年03月18日

👍10 ❤5 🚀2

🙏

BennyZ28 2019年03月18日

@ BennyZ28解決策は何でしたか？

回避策は複雑すぎます。ストーリーがDOMツリーに追加された直後に呼び出されるコールバックをストーリーブックが提供しないのはなぜですか？

vipcxj 2020年04月04日

👍17

このページは役に立ちましたか？

0 / 5 - 0 評価

Storybook: @ storybook / html 5.0.1は、ストーリーの読み込み時にスクリプトを実行できません。別名「DOMContentLoaded」は機能しなくなりました

最も参考になるコメント

全てのコメント6件

関連する問題