vue 3.0でelementを使用する完全なステップ
前言:
vue 3.0ではelementフレームを使っています。elementはvue 2.0をサポートしています。彼が出したサポートvue 3.0のバージョンは element-plus
公式サイト入口:時に入ります
一、個人が遭遇した問題と解決方法:
遭遇した問題:
直接cnpmを使います i element-plus -Sのバージョンは、なぜ知らないですか?図1を間違えて報告しています。バージョン図2は、私のコードの中で図3を使っています。
解決策:
私はpackage.jsonのelement-plusのバージョンを変更します。 次の文は問題を解決しました。
"element-plus":"^1.0.1-alpha.19","
二、具体的に使う
1、グローバル導入:
インストール
2、必要に応じて導入する:
(1)
(2)新規にフォルダpluginsを追加し、プロファイルelement.jsを新規に作成する
(4)elementと同じように正常に使えばいいです。
締め括りをつける
ここで、vue 3.0でelementを使った文章を紹介します。もっと関連したvue 3.0はelementの内容を使っています。以前の文章を検索したり、次の関連記事を見たりしてください。これからもよろしくお願いします。
vue 3.0ではelementフレームを使っています。elementはvue 2.0をサポートしています。彼が出したサポートvue 3.0のバージョンは element-plus
公式サイト入口:時に入ります
一、個人が遭遇した問題と解決方法:
遭遇した問題:
直接cnpmを使います i element-plus -Sのバージョンは、なぜ知らないですか?図1を間違えて報告しています。バージョン図2は、私のコードの中で図3を使っています。
解決策:
私はpackage.jsonのelement-plusのバージョンを変更します。 次の文は問題を解決しました。
"element-plus":"^1.0.1-alpha.19","
二、具体的に使う
1、グローバル導入:
インストール
cnpm i element-plus -S
mail.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と同じように正常に使えばいいです。
締め括りをつける
ここで、vue 3.0でelementを使った文章を紹介します。もっと関連したvue 3.0はelementの内容を使っています。以前の文章を検索したり、次の関連記事を見たりしてください。これからもよろしくお願いします。