仅有尝试过，努力过，坚持过，才能有收获。一分耕耘，一分收获，仅有努力了，才能绽放出成功的花朵。只要功夫深，铁杵磨成针。我相信，只要我朝着这个梦想努力奋斗，坚持不懈，那么，我就必须会成功！
前言：
在vue3.0中使用element框架，因为element是支持vue2.0的，他推出的支持vue3.0的版本叫element-plus
官网入口：点我进入
一、个人遇到的问题与解决办法：
遇到的问题：
我直接用cnpm ielement-plus-S 装的版本，不知道为啥，一直报错 图1，版本型号 图2 ，我的代码中使用图3
解决办法：
我把package.json中的element-plus的版本更换成 下面这句话，解决了问题（是否为最新版本问题，还在求证中）
"element-plus": "^1.0.1-alpha.19",
二、具体使用
1、全局引入：
安装 cnpm i element-plus -S
main.js中加入：
import 'element-plus/lib/theme-chalk/index.css'
import ElementPlus from 'element-plus'
const app = createApp(App)
app.use(ElementPlus)
app.use(store).use(router).mount('#app')
页面上正常使用
2、按需引入：
（1）安装 cnpm i element-plus -S
（2）新加文件夹 plugins ,新建配置文件 element.js
import {
// ElAlert,
ElAside,
// ElAutocomplete,
// ElAvatar,
// ElBacktop,
// ElBadge,
// ElBreadcrumb,
// ElBreadcrumbItem,
ElButton,
// ElButtonGroup,
// ElCalendar,
// ElCard,
// ElCarousel,
// ElCarouselItem,
// ElCascader,
// ElCascaderPanel,
// ElCheckbox,
// ElCheckboxButton,
// ElCheckboxGroup,
// ElCol,
// ElCollapse,
// ElCollapseItem,
// ElCollapseTransition,
// ElColorPicker,
ElContainer,
// ElDatePicker,
// ElDialog,
// ElDivider,
// ElDrawer,
ElDropdown,
ElDropdownItem,
ElDropdownMenu,
// ElFooter,
ElForm,
ElFormItem,
ElHeader,
// ElIcon,
// ElImage,
ElInput,
// ElInputNumber,
// ElLink,
ElMain,
ElMenu,
ElMenuItem,
ElMenuItemGroup,
// ElOption,
// ElOptionGroup,
// ElPageHeader,
// ElPagination,
ElPopconfirm,
// ElPopover,
ElPopper,
// ElProgress,
// ElRadio,
// ElRadioButton,
// ElRadioGroup,
// ElRate,
// ElRow,
// ElScrollBar,
// ElSelect,
// ElSlider,
// ElStep,
// ElSteps,
ElSubmenu,
// ElSwitch,
ElTabPane,
ElTabs,
// ElTable,
// ElTableColumn,
// ElTimeline,
// ElTimelineItem,
ElTooltip,
// ElTransfer,
// ElTree,
// ElUpload,
// ElInfiniteScroll,
// ElLoading,
// ElMessage,
ElMessageBox,
ElNotification
} from 'element-plus'
import lang from 'element-plus/lib/locale/lang/zh-cn'
import locale from 'element-plus/lib/locale'
export default (app) => {
locale.use(lang)
app.use(ElButton)
app.use(ElNotification)
app.use(ElContainer)
app.use(ElAside)
app.use(ElHeader)
app.use(ElMain)
app.use(ElDropdown)
app.use(ElDropdownItem)
app.use(ElDropdownMenu)
app.use(ElTabPane)
app.use(ElTabs)
app.use(ElMenu)
app.use(ElMenuItem)
app.use(ElMenuItemGroup)
app.use(ElSubmenu)
app.use(ElTooltip)
app.use(ElPopper)
app.use(ElPopconfirm)
app.use(ElMessageBox)
app.use(ElInput)
app.use(ElForm)
app.use(ElFormItem)
}
（3）main.js中配置
（4）跟element一样正常使用就可以了
总结
到此这篇关于vue3.0中使用element的文章就介绍到这了,更多相关vue3.0使用element内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！