前言
公司在使用vue搭配elementui開發(fā)后臺(tái)系統(tǒng)，中間遇到了大大小小的“坑”，需要總結(jié)下，以防后期遇到。
一、elementui的鍵盤回車事件導(dǎo)致頁面刷新
elementUi提供了輸入框的鍵盤事件：@keyup.enter.native="callOut"
例如：<el-form><el-input placeholder="輸入號(hào)碼回車即可呼叫" v-model="num" @keyup.enter.native="callOut"></el-input></el-form>
現(xiàn)在這個(gè)form里只有一個(gè)input，你回車,它竟然沒有觸發(fā)事件，而是刷新頁面了，而且放兩個(gè)input就沒問題了，
W3C標(biāo)準(zhǔn)的說法是：當(dāng)一個(gè) form 元素中只有一個(gè)輸入框時(shí)，在該輸入框中按下回車應(yīng)提交該表單。如果希望阻止這一默認(rèn)行為，可以在 標(biāo)簽上添加@submit.native.prevent。
所以我們給form表單上加一個(gè)@submit.native.prevent? :
：<el-form @submit.native.prevent?><el-input placeholder="輸入號(hào)碼回車即可呼叫" v-model="num" @keyup.enter.native="callOut"></el-input></el-form>
搞定!
二、input等的placeholder在ie下失效
本地好好的，但是打包之后發(fā)到測試環(huán)境發(fā)現(xiàn)，input里的placeholder竟然不是灰色的，就好像已經(jīng)輸入了文字一樣,也不光是input的，所有用的placeholder的標(biāo)簽都是黑色的，應(yīng)該是ie對placeholder支持性差導(dǎo)致的
解決方案：
在vue項(xiàng)目引用的index.css里加上
// 兼容placeholder ::-moz-placeholder{color:#c0c4cc;} //Firefox ::-webkit-input-placeholder{color:#c0c4cc;} //Chrome,Safari :-ms-input-placeholder{color:#c0c4cc;} //IE再打包，發(fā)布測試，打開，搞定，都是灰色的了
