Bootstrap

vue3单独引用element-plus的Infinite Scroll无限滚动;vue3自定义指令

1.正常单独使用element-plus其他功能组件

引入即可使用

import { ElSelect, ElOption } from "element-plus"

2.引入类似与指令的插件

需要先引入,再注册,才可以使用
指令类的组件:例如v-infinite-scroll="load"

<div v-infinite-scroll-directive="load" style="overflow: hidden">
     ...
</div>
      
import { ElInfiniteScroll } from "element-plus" // 注意是引入ElInfiniteScroll 不是VInfiniteScroll

// 必须注册指令(TS需要显式声明)
const vInfiniteScrollDirective = ElInfiniteScroll

// 原来在项目内使用v-infinite-scroll="load";
// 如果是按照上述在某个vue页面单独引入和注册后;
// 需要使用注册后的指令名 v-infinite-scroll-directive="load"

const load = ()=>{}

3.自定义指令钩子

<input v-focus />

<script setup>
// 在模板中启用 v-focus
const vFocus = {
  mounted: (el) => el.focus()
}

</script>

这里是引用

详细使用文档
在这里插入图片描述

;