ElementPlus Affix 固釘

Affix 固釘

將頁(yè)面元素固定在特定可視區(qū)域。

基本用法

固釘默認(rèn)固定在頁(yè)面頂部。

通過(guò)設(shè)置 offset 屬性來(lái)改變吸頂距離，默認(rèn)值為 0。

<template>
  <el-affix :offset="120">
  <el-button type="primary">距離頂部 120px</el-button>
</el-affix>
</template>

指定容器

通過(guò)設(shè)置 target 屬性，讓固釘始終保持在容器內(nèi)，超過(guò)范圍則隱藏。

請(qǐng)注意容器避免出現(xiàn)滾動(dòng)條。

<template>
  <div class="affix-container">
  <el-affix target=".affix-container" :offset="80">
    <el-button type="primary">指定容器</el-button>
  </el-affix>
</div>
</template>

固定位置

Affix 組件提供了兩個(gè)固定位置：top 和 bottom。

通過(guò)設(shè)置 position 屬性來(lái)改變固定位置，默認(rèn)值為 top 。

<template>
  <el-affix position="bottom" :offset="20">
  <el-button type="primary">距離底部 20px</el-button>
</el-affix>
</template>

Attributes

Events

Methods