CSS スティッキーレイアウトを使用してヘッダーを上部に配置する方法

window.addEventListener("スクロール", this.handleScroll);

コンポーネントが破棄される前にこのイベントを削除することを忘れないでください beforeDestroyed() {
    window.removeEventListener("スクロール"、this.handleScroll);
  }

// 各質問に必ず参照を設定してください。私の参照は各質問の ID です。

-- Vue の略語 ---
<div
  :ref="質問ID"
  v-for="formData.questions の (質問、インデックス)"
  :key="インデックス"
>


// 乱雑さの問題を防ぐために、ソートも実行しました ---- js -----
 this.topPositionArr = [];
  for (let key in this.$refs) {
      for (let idx in this.$refs[key]) {
        this.topPositionArr.push(this.$refs[key][idx].offsetTop);
      }
    }
    this.topPositionArr = [...新しいSet(this.topPositionArr)];
    this.topPositionArrtopPositionArr = this.topPositionArr.sort(
      (a, b) => {
        a - b を返します。
      }
    );        

// さまざまなブラウザと互換性があります。ブラウザによって offsetTop を取得する方法が異なります。handleScroll() {
    this.scrollTop = document.documentElement.scrollTop
  ? ドキュメント.documentElement.scrollTop
  : ドキュメント本体のスクロールトップ;
  
scrollTop を this.scrollTop とします。
// 最初の質問の scrollTop は変更されず、2 番目の質問の scrollTop が変更されます this.topPositionArr.forEach((item, idx) => {
  （idx > 1）の場合{
    this.scrollTop = scrollTop + 220;
  }
  //なぜこれを行うのですか? IEは固定レイアウトをサポートしていないため、補助するプラグインが必要です。if (this.scrollTop > item) {
    elements = document.getElementById(`sticky${idx}`);
    スティッキーフィルに要素を追加します。
  }
});
}

npm インストール スティッキーフィル 
糸 スティッキーフィルを追加

<div
  :id="`sticky${question.index}`"
  クラス="isSticky"
>

必要なページにインポートします。
<script src="stickyfill.min.js へのパス"></script>
var Stickyfill = require("stickyfill");
var スティッキーフィル = スティッキーフィル();

具体的な方法については上記3を参照
elements = document.getElementById(`sticky${idx}`);
スティッキーフィルに要素を追加します。