UNPKG

zyj-ip-input

Version:

基于Vue2的ip输入框

2 lines 4.55 kB
(function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define([],t):"object"===typeof exports?exports["zyj-ip-input"]=t():e["zyj-ip-input"]=t()})("undefined"!==typeof self?self:this,(function(){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var i=t[r]={i:r,l:!1,exports:{}};return e[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(r,i,function(t){return e[t]}.bind(null,i));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s="fb15")}({1439:function(e,t,n){},e319:function(e,t,n){"use strict";n("1439")},fb15:function(e,t,n){"use strict";if(n.r(t),"undefined"!==typeof window){var r=window.document.currentScript,i=r&&r.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);i&&(n.p=i[1])}var o=function(){var e=this,t=e._self._c;return t("div",{class:{disabled:e.disabled}},[t("ul",{staticClass:"ipAdress"},e._l(e.ipAddress,(function(n,r){return t("li",{key:r},[t("input",{directives:[{name:"model",rawName:"v-model",value:n.value,expression:"item.value"}],ref:"ipInput",refInFor:!0,staticClass:"ipInputClass",attrs:{type:"text",disabled:e.disabled},domProps:{value:n.value},on:{input:[function(t){t.target.composing||e.$set(n,"value",t.target.value)},function(t){return e.checkIpVal(n)}],keyup:function(t){return e.turnIpPosition(n,r,t)},blur:e.handleBlur}}),t("div")])})),0)])},s=[],u={model:{prop:"value",event:"change"},props:{value:{type:String,default:""},disabled:{type:Boolean,default:!1}},data(){return{ipAddress:[{value:""},{value:""},{value:""},{value:""}]}},mounted(){this.initShowValue()},watch:{ipAddress:{handler:function(){let e="";for(const t in this.ipAddress)e+=this.formatter(this.ipAddress[t].value);"000000000000"===e&&(e=""),this.$emit("change",this.ipAddress.map(e=>null!==e.value?e.value+"":"0").join("."))},deep:!0},value(){this.initShowValue()}},methods:{handleBlur(){console.log("处理"),this.$emit("blur")},initShowValue(){if(""===this.value)this.ipAddress[0].value="",this.ipAddress[1].value="",this.ipAddress[2].value="",this.ipAddress[3].value="";else{let e=this.value.split(".");this.ipAddress[0].value=e[0]||"",this.ipAddress[1].value=e[1]||"",this.ipAddress[2].value=e[2]||"",this.ipAddress[3].value=e[3]||""}},formatter(e){let t=e.toString();return 2===t.length?t="0"+t:1===t.length?t="00"+t:0===t.length&&(t="000"),t},checkIpVal(e){let t=e.value;t=t.toString().replace(/[^0-9]/g,""),t=parseInt(t,10),isNaN(t)?t="":(t=t<0?0:t,t=t>255?255:t),e.value=t},turnIpPosition(e,t,n){let r=this,i=n||window.event;37===i.keyCode?0!==t&&0===i.currentTarget.selectionStart&&r.$refs.ipInput[t-1].focus():39==i.keyCode?3!==t&&i.currentTarget.selectionStart===e.value.toString().length&&r.$refs.ipInput[t+1].focus():8===i.keyCode?0!==t&&""===e.value&&r.$refs.ipInput[t-1].focus():13===i.keyCode||32===i.keyCode||190===i.keyCode||110===i.keyCode?3!==t&&r.$refs.ipInput[t+1].focus():3===e.value.toString().length&&3!==t&&r.$refs.ipInput[t+1].focus()}}},l=u;n("e319");function a(e,t,n,r,i,o,s,u){var l,a="function"===typeof e?e.options:e;if(t&&(a.render=t,a.staticRenderFns=n,a._compiled=!0),r&&(a.functional=!0),o&&(a._scopeId="data-v-"+o),s?(l=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"===typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),i&&i.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(s)},a._ssrRegister=l):i&&(l=u?function(){i.call(this,(a.functional?this.parent:this).$root.$options.shadowRoot)}:i),l)if(a.functional){a._injectStyles=l;var d=a.render;a.render=function(e,t){return l.call(t),d(e,t)}}else{var p=a.beforeCreate;a.beforeCreate=p?[].concat(p,l):[l]}return{exports:e,options:a}}var d=a(l,o,s,!1,null,"7ac9fc59",null),p=d.exports;p.install=e=>{e.component("ip-input-vue",p)};var f=p;t["default"]=f}})})); //# sourceMappingURL=zyj-ip-input.umd.min.js.map