vue中如何實(shí)現(xiàn)的自定義按鈕

biaoxiaoduan 發(fā)布于2019-08-23 16:29 / 2253人閱讀

摘要：在實(shí)際開(kāi)發(fā)項(xiàng)目中，有時(shí)我們會(huì)用到自定義按鈕因?yàn)橐粋€(gè)項(xiàng)目中，眾多的頁(yè)面，為了統(tǒng)一風(fēng)格，我們會(huì)重復(fù)用到很多相同或相似的按鈕，這時(shí)候，自定義按鈕組件就派上了大用場(chǎng)，我們把定義好的按鈕組件導(dǎo)出，在全局引用，就可以在其他組件隨意使用啦，這樣可以大幅度

在實(shí)際開(kāi)發(fā)項(xiàng)目中，有時(shí)我們會(huì)用到自定義按鈕；因?yàn)橐粋€(gè)項(xiàng)目中，眾多的頁(yè)面，為了統(tǒng)一風(fēng)格，我們會(huì)重復(fù)用到很多相同或相似的按鈕，這時(shí)候，自定義按鈕組件就派上了大用場(chǎng)，我們把定義好的按鈕組件導(dǎo)出，在全局引用，就可以在其他組件隨意使用啦，這樣可以大幅度的提高我們的工作效率。

好了，話不多說(shuō)，上代碼：
img-button.vue//這是我們自定義按鈕組件

在router.js中配置好路由
在main.js中引入

//注冊(cè)自定義按鈕  
import imgButton from "./components/img-button"
Vue.use(imgButton)

然后就可以在其他組件使用了

//值得注意的是自定義按鈕組件添加點(diǎn)擊事件的時(shí)候一定要加.native 因?yàn)?native 修飾符就是用來(lái)注冊(cè)元素的原生事件而不是組件自定義事件的

好了今天的分享就到這了。

云服務(wù)器 GPU云服務(wù)器 php的自定義函數(shù) 自定義如何實(shí)現(xiàn) js中如何定義字符 js中如何定義json數(shù)據(jù)

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/103084.html

相關(guān)文章

vue中如何實(shí)現(xiàn)的自定義按鈕

摘要：在實(shí)際開(kāi)發(fā)項(xiàng)目中，有時(shí)我們會(huì)用到自定義按鈕因?yàn)橐粋€(gè)項(xiàng)目中，眾多的頁(yè)面，為了統(tǒng)一風(fēng)格，我們會(huì)重復(fù)用到很多相同或相似的按鈕，這時(shí)候，自定義按鈕組件就派上了大用場(chǎng)，我們把定義好的按鈕組件導(dǎo)出，在全局引用，就可以在其他組件隨意使用啦，這樣可以大幅度在實(shí)際開(kāi)發(fā)項(xiàng)目中，有時(shí)我們會(huì)用到自定義按鈕；因?yàn)橐粋€(gè)項(xiàng)目中，眾多的頁(yè)面，為了統(tǒng)一風(fēng)格，我們會(huì)重復(fù)用到很多相同或相似的按鈕，這時(shí)候，自定義按鈕組件就...

BenCHou 2019-08-30 15:43 評(píng)論0 收藏0
認(rèn)識(shí)Vue組件

摘要：認(rèn)識(shí)組件組件是強(qiáng)大的功能之一。注意，所有的組件同時(shí)也都是的實(shí)例，可接受相同的選項(xiàng)對(duì)象。組件全局注冊(cè)時(shí)通過(guò)方式注冊(cè)?？紤]到會(huì)出現(xiàn)禁止使用的場(chǎng)景，需要禁止和啟用組件的功能，所以需要。同樣也是先在子組件的選項(xiàng)中定義好傳遞過(guò)來(lái)的數(shù)據(jù)。前言 Vue.js是一套構(gòu)建用戶界面的漸進(jìn)式框架（官方說(shuō)明）。通俗點(diǎn)來(lái)說(shuō)，Vue.js是一個(gè)輕量級(jí)的，易上手易使用的，便捷，靈活性強(qiáng)的前端MVVM框架。簡(jiǎn)潔的A...

xumenger 2019-08-22 11:19 評(píng)論0 收藏0
vue實(shí)現(xiàn)可視化可拖放的自定義表單

摘要：實(shí)現(xiàn)如例子所示的可視化可拖放表單功能。點(diǎn)擊某個(gè)組件時(shí)，在右欄顯示其屬性，其實(shí)也就是在存放的數(shù)據(jù)中查找數(shù)據(jù)迭代屬性。左中右三欄左右固定中間自適應(yīng)布局首先，布局上來(lái)看，左右都是可以拉伸的，中間是自適應(yīng)的布局?？梢允褂脙鼋Y(jié)對(duì)象，避免出錯(cuò)。實(shí)現(xiàn)如例子所示的可視化可拖放表單功能。整個(gè)頁(yè)面，分為左中右三欄布局，左欄的部件庫(kù)的部件（組件）作為key,拖放到中間區(qū)域時(shí)，往vuex存放數(shù)組數(shù)據(jù)，拖一個(gè)...

import. 2019-08-23 16:08 評(píng)論0 收藏0
vue2.0開(kāi)發(fā)聊天程序（三）組件的通信

摘要：我在中寫(xiě)了這段代碼在組件被創(chuàng)建時(shí)候?qū)?huì)執(zhí)行此函數(shù)相當(dāng)于進(jìn)入頁(yè)面的自執(zhí)行使用方法監(jiān)聽(tīng)屬性并執(zhí)行一個(gè)回調(diào)函數(shù)按道理在元素被創(chuàng)建的時(shí)候，會(huì)將監(jiān)聽(tīng)到的值賦給并且打印。天地不仁以萬(wàn)物為芻狗，宇宙無(wú)義視眾生如螻蟻　　　　　　　　　　　　　　　　　　——蕭鼎和我上一節(jié)列出了５個(gè)關(guān)鍵點(diǎn)，第一個(gè)路由已經(jīng)解決了，接下來(lái)解決第二個(gè)問(wèn)題：組件的通信問(wèn)題一、組件的關(guān)系組件之間的關(guān)系無(wú)非就是兩種父子關(guān)系...

ddongjian0000 2019-08-21 11:27 評(píng)論0 收藏0
vue-quill-editor自定義圖片上傳

摘要：我們通常都會(huì)使用富文本編輯器在后臺(tái)編輯內(nèi)容，開(kāi)發(fā)當(dāng)然也少不了，我們通過(guò)官網(wǎng)的鏈接可以找到一些資源，或者去上查找一些開(kāi)源的編輯器。我們通常都會(huì)使用富文本編輯器在后臺(tái)編輯內(nèi)容，開(kāi)發(fā)vue當(dāng)然也少不了，我們通過(guò)vue官網(wǎng)的鏈接可以找到一些資源，或者去github上查找一些開(kāi)源的編輯器。我使用的是vue-quill-editor，它的界面很簡(jiǎn)潔，功能也滿足平時(shí)的編輯需要，不過(guò)于臃腫，但是它默...

oneasp 2019-08-20 17:26 評(píng)論0 收藏0