vue3引入element plus中的分页组件

要引入Element Plus中的分页组件到Vue 3项目中，你需要先安装Element Plus库。如果你还没有安装，请使用npm或yarn进行安装：

# 使用npm
npm install element-plus @vue/cli-plugin-element-plus

# 或者使用yarn
yarn add element-plus @vue/cli-plugin-element-plus

接下来，确保你在`main.js`或其他入口文件中配置了Element Plus：

// main.js
import { createApp } from 'vue'
import App from './App.vue'
import ElementPlus from 'element-plus'

createApp(App).use(ElementPlus).mount('#app')

然后，在你的Vue组件中，你可以像下面这样导入并使用分页组件`el-pagination`：

<template>
  <div>
    <!-- 其他内容 -->
    <el-pagination
      :total="totalItems"
      :current-page="currentPage"
      :page-size="pageSize"
      @current-change="handleCurrentChange"
      layout="prev, pager, next"
    ></el-pagination>
    <!-- 更多内容 -->
  </div>
</template>

<script setup>
import { ref } from 'vue'

const totalItems = ref(100) // 总数据量
const currentPage = ref(1) // 当前页数
const pageSize = ref(10) // 每页显示的数量

function handleCurrentChange(page) {
  console.log(`当前页切换到了第${page}页`)
}
</script>

别忘了替换`totalItems`, `currentPage`, 和 `pageSize` 的值为实际的数据源。

现在你已经设置了基本的分页功能。Element Plus提供了很多可自定义的属性和事件，你可以查阅官方文档（https://element-plus.org/zh-CN/component/pagination）了解更多信息。