问题:使用elementUI的el-input框如何使绑定的数据初始值为0时也能正常显示?
使用elementUI时发现el-input为number类型时,绑定的值初始值为0,竟然不显示,如图:
虽然输入框中没有显示值,但从数据里可以看出,数据的类型为number,值为0。
当值被手动改为0时,此时能正常显示。
如果将el-input换成普通的input,可以正常显示,就是调样式有点麻烦。
使用el-input,绑定的数据为字符串0时,可以显示,但是不想对初始值的类型做手脚。
然而在官网例子中发现,初始值为0时也能正常显示???
html
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.2.2/lib/index.js"></script>
<div id="app">
<el-input v-model="input" type="number"></el-input>
</div>
js
var Main = {
data() {
return {
input: 0
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
我用的版本是2.3.4,官网例子为2.4.5和2.2.2时都能正常显示。
还有发现,即使el-input的类型是text,绑定的数据初始值为0,也不会显示,字符串0就正常。
懵了,求解疑
刚好就是因为版本的问题,2.3.5修复的这个问题
个人建议更新到最新的2.4.X,因为在2.4.0版本,input-number新增了 precision 属性,能对精度进行限制,要方便不少
2.3.3版本
2.3.4版本
2.3.5版本