vue實用技巧總結

2021-09-16 22:21:07 字數 1194 閱讀 3181

總結一些新手可能會迷惑但是專案中常用的小技巧

給元件繫結原生事件

對於一般的html元素,繫結自定義事件使用v-on即可,但是在某個元件的根元素上監聽乙個原生事件,比如:

我們會發現這樣是不起作用的,可以使用.native修飾

其實它不過是下面示例的簡寫

所以在自定義元件上也可以使用v-model

相當於下面示例的簡寫

在元件內部,通過this.$emit('input', value)可以改變something的值

使用vue-cli構建專案,預設情況下,路由檔案(/router/index.js)使用import引入vue元件:

import vue from 'vue'

import router from 'vue-router'

import index from '@/components/index'

這時候我們需要將檔案拆分成多個小檔案,分模組打包,使用webpage的require.ensure,加上chunk名,chunk名相同的會被打包到同乙個js檔案裡面。

const home = resolve => );

};const list = resolve => );

};const list2 = resolve => );

};

這裡要注意的是使用chunk,如果你的filename是寫死的,則需要配置chunkfilename,和publicpath,如:

module.exports=
或者你的filename可以寫成:filename:'[name].js',則可不配置chunkfilename,和publicpath

未完待續~

關注作者吧~

vartical align實用技巧總結

vartical align的用法非常複雜,但是非常強大,下面介紹一些實用技巧。首先w3c官方對vartical align屬性的定義有四個方面 1 vartical align屬性用於定義 周圍的文字 inline元素 以及inline block元素 相對於該元素基線的垂直對齊方式。這裡的該元素...

Linux 實用技巧

值得一提的是vim是慈善軟體 charityware 如有贊助或評比得獎,所得將全部救助烏干達孤兒,軟體使用是免費的,歡迎手頭有點閒錢的使用者捐款贊助,如果沒銀子也沒關係,至少當有評比活動時 有獎金可拿的那種 應用技巧一 快速注釋 1 連續行注釋 使用vim vi編輯shell指令碼,在進行除錯的時...

vim實用技巧

以前習慣於eclipse,sourceinsight,vim用的不是很熟悉,在現在的公司中,vim是一種必備的技巧,慢慢,從難受到得心應手,vim還是比較好用的,下面記錄一點實用的技巧 1 vim ctags cscope是乙個強大的比擬於sourceinsight的字元介面的工具 2 ctrl 跳...