Поппер не придерживается ссылки на элемент на свитке

Question

Демонстрация: https://codesandbox.io/s/agitated-euler-rep54

Нажмите на любой "нажмите меня, чтобы установить ссылку". Поппер правильно позиционирует себя. Теперь начните прокрутку, и вы увидите, что поппер не придерживается ссылки.

Если вы переместите .popper, чтобы стать прямым потомком .scroll-body, это сработает.

<div id="app">
    <div class="scroll-body">
      <div v-for="n in 40">
          <span @click="setRef" class="ref">
            click me to set ref
          </span>
      </div>
    </div>
    <div ref="popper" class="popper">popper</div>
</div>

Какой параметр popper мне нужно установить, чтобы он работал?

Answer 1

Вам следует избегать изменения ссылки после того, как экземпляр был создан, как state.elements.reference = newReference, и вместо этого полностью создать экземпляр fre sh popper. Причина в том, что scrollParents обнаружение выполняется при создании (или обновлении) экземпляра.

https://codesandbox.io/s/nifty-night-5vjfm

Вы можете динамически изменять ссылку, если вы вызываете .setOptions({}) после установки, хотя, но я бы рекомендовал вместо этого выше.

Answer 2

Если поставить overflow-y: прокрутка; на #app это будет работать так, как вы хотите. Overflow-y должен быть установлен на родительском элементе, чтобы он влиял на дочернего элемента.