vue 中实现ip输入框
最近因工作需求,项目中需要输入ip,所以就想弄一个类型windows系统中的那种ip输入框,一开始也在网上找了现有的插件,但是只找到了jq的一个原生插件,他的ui又和项目不符,所以就想着用vue自己写一个,目前感觉功能方面基本都OK了。先上代码
首先是四个输入框
<el-form-item label="IP地址">
<el-input
:clearable="false"
v-model="ip1"
id="ip1"
ref="ip1"
placeholder="0-255"
size="small"
style="width: 70px; text-align: right"
onkeyup="this.value=this.value.replace(/\D/g,'')"
maxlength="3"
/>
<el-input
:clearable="false"
v-model="ip2"
ref="ip2"
placeholder="0-255"
size="small"
style="width: 70px"
onkeyup="this.value=this.value.replace(/\D/g,'')"
maxlength="3"
@keyup.backspace.native="fallbackIn2"
/>
<el-input
:clearable="false"
v-model="ip3"
ref="ip3"
placeholder="0-255"
size="small"