- 問題:
在body中引入'\5170\4EAD\7C97\9ED1 GBK_1'這個(gè)字體,li中有元素帶有float屬性時(shí)碗殷,內(nèi)容會(huì)進(jìn)行梯次排列,很詭異精绎。。锌妻。
解決辦法:
添加固定高度
- vue中的事件委托
問題:
無論用vue還是jq,做后臺(tái)系統(tǒng)的項(xiàng)目,基本上都會(huì)用到給ul中的每個(gè)li添加事件的情況,如果用<li v-for="(item,index) in items" :key="index" @click="doSomethings">
這種方式去分別添加事件雖然能解決一部分問題代乃,但無論從代碼美觀角度還是從性能考慮,都是不好的
解決辦法:
如果使用jq或者原生js仿粹,自然就想到了事件委托來做搁吓,但在大火的vue中該如何做呢原茅?
<ul class="list-box" @click="jump">
<li v-for="(item,index) in teamData" :key="index" :data-index="index" :data-link="item.url">
<div>
<img :src="item.imgUrl" :alt="item.title">
</div>
<div>
<h4>{{item.title}}</h4>
<span>{{item.time}}</span>
<p>{{item.content}}</p>
</div>
</li>
</ul>
<script>
export default({
methods: {
jump(e){
const curEle = e.target.parentNode.parentNode;
const url = curEle.dataset.link;
if(curEle.tagName.toLowerCase() == 'li'){
window.location.href = url
}
"在這里可以進(jìn)行各種DOM操作,switch判斷(實(shí)際需求中有相對(duì)復(fù)雜的結(jié)構(gòu)的時(shí)候)"
}
}
})
</script>
- 問題:vue-cli中GZIP壓縮堕仔,如果用戶的瀏覽器支持壓縮就發(fā)送壓縮的相應(yīng)內(nèi)容擂橘,如果不支持就發(fā)沒壓縮的響應(yīng)內(nèi)容,一般的現(xiàn)代瀏覽器都支持來的摩骨;
解決辦法:
找到vue-cli中config/index.js文件通贞,將build對(duì)象中的productionGzip設(shè)置為true就可以了,依據(jù)不同的情況仿吞,經(jīng)個(gè)人測(cè)試滑频,差不多都是壓縮到30%起的
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者