新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
詳解VUE對element-ui中的ElTableColumn擴展
公司有一個新的需求,點擊ElTableColumn的頭部可以進行搜索,這個功能同事已經(jīng)做出來了,但是使用有些不方便,自己就打算封裝成一個組件,學習一下。
公司主營業(yè)務:成都做網(wǎng)站、網(wǎng)站制作、移動網(wǎng)站開發(fā)等業(yè)務。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領域給我們帶來的挑戰(zhàn),讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)推出定州免費做網(wǎng)站回饋大家。
ElTableColumn本來是這個樣子的:
要做成的是這個樣子:
我直接就放代碼了,挨著挨著說明太多了。
代碼的結(jié)構(gòu):
組件
import ElTableColumnPro from './ElTableColumnPro' ElTableColumnPro.install = function(Vue) { Vue.component(ElTableColumnPro.name, ElTableColumnPro); }; export default ElTableColumnPro; {{fomatMethod(scope.row[prop])}}
安裝
import ElTableColumnPro from 'components/ElTableColumnPro/index' ... ... ... Vue.use(ElTableColumnPro)
使用
{{scope.row.content}}
注釋就不挨著打了....
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。
標題名稱:詳解VUE對element-ui中的ElTableColumn擴展
文章URL:http://www.ef60e0e.cn/article/gpodpg.html