Element-ui Drawer抽屜按需引入基礎(chǔ)使用
更新時(shí)間：2023年07月06日 11:46:22 作者：菜園前端
這篇文章主要為大家介紹了Element-ui Drawer抽屜按需引入基礎(chǔ)使用，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
Element-ui Drawer 抽屜
展示另外一種彈窗效果
按需引入方式
如果是完整引入可跳過此步驟
import Vue from 'vue'
import { Drawer } from 'element-ui'
import 'element-ui/lib/theme-chalk/base.css'
import 'element-ui/lib/theme-chalk/drawer.css'
Vue.use(Drawer)基礎(chǔ)使用
<template>
<div>
<el-radio-group v-model="direction">
<el-radio label="ltr">從左往右開</el-radio>
<el-radio label="rtl">從右往左開</el-radio>
<el-radio label="ttb">從上往下開</el-radio>
<el-radio label="btt">從下往上開</el-radio>
</el-radio-group>
<el-button @click="drawer = true" type="primary" style="margin-left: 16px;"> 點(diǎn)我打開 </el-button>
<el-drawer title="我是標(biāo)題" :visible.sync="drawer" :direction="direction">
<span>我來啦!</span>
</el-drawer>
</div>
</template>
<script>
export default {
data() {
return {
drawer: false,
direction: 'rtl'
}
}
}
</script>Drawer Attributes
以上就是Element-ui Drawer抽屜按需引入基礎(chǔ)使用的詳細(xì)內(nèi)容，更多關(guān)于Element-ui Drawer抽屜的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要介紹了解讀為什么vue前端項(xiàng)目要使用Nodejs問題,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2025-03-03
windows下vue-cli導(dǎo)入bootstrap樣式
這篇文章主要介紹了windows下vue-cli導(dǎo)入bootstrap樣式，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-04-04
這篇文章主要介紹了vue 的 solt 子組件過濾過程解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
這篇文章主要介紹了vue 自定義icon的圖標(biāo)的步驟，文中大概給大家分為兩步驟，通過實(shí)例圖文相結(jié)合給大家介紹的非常詳細(xì),需要的朋友可以參考下2021-08-08
這篇文章主要介紹了Element-UI+Vue模式使用總結(jié)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01
一文詳解WebStorm如何調(diào)試Vue項(xiàng)目
這篇文章主要介紹了如何使用WebStorm進(jìn)行斷點(diǎn)調(diào)試,包括配置、啟動(dòng)本地應(yīng)用程序、設(shè)置斷點(diǎn)以及使用調(diào)試工具等步驟,文中通過圖文及代碼介紹的非常詳細(xì),需要的朋友可以參考下2025-02-02
這篇文章主要介紹了Vue項(xiàng)目配置在局域網(wǎng)下訪問方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-04-04
這篇文章主要介紹了vue中的代理proxy，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-02-02
vue中關(guān)于v-for循環(huán)key值問題的研究
這篇文章主要介紹了vue中關(guān)于v-for循環(huán)key值問題的研究，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
vue項(xiàng)目中?jsconfig.json概念及使用步驟
這篇文章主要介紹了vue項(xiàng)目中?jsconfig.json是什么,本文僅僅簡單介紹了?jsconfig?.json?的一些基本配置，而?jsconfig?.json提供了大量能使我們快速便捷提高代碼效率的方法，需要的朋友可以參考下2022-07-07