guys, how do you limit input to entering numbers in vue? Vue-cli built the project, the introduction of the iview UI framework.
guys, how do you limit input to entering numbers in vue? Vue-cli built the project, the introduction of the iview UI framework.
you can refer to the following. At present, this is a limit. You can only enter numbers, keep only 2 decimal places, and cannot enter spaces.
<div id="app">
<input type="text" v-model="a" @input="change(a)" />
</div>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
<script type="text/javascript">
new Vue({
el: "-sharpapp",
data: {
a: ""
},
methods: {
change(val) {
val = val.replace(/(^\s*)|(\s*$)/g, "")
if(!val) {
this.a = "";
return
}
var reg = /[^\d.]/g
//
val = val.replace(reg, "")
//
val = val.replace(/^\./g, "");
// 1
val = val.replace(".", "$-sharp$").replace(/\./g, "").replace("$-sharp$", ".");
// 2
val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');
this.a = val;
}
}
})
</script>v-model.number
input limit array, don't you set number by type in input?
or according to the official website
< input vmurmodel.number = "age" type= "number" >
Link: ide/forms.html-sharpnumber" rel=" nofollow noreferrer "> https://cn.vuejs.org/v2/guide.
Vue Native Writing rules replace what you need now the limit is that you can only enter numbers
<input type="text" v-model="_msg">
//////////////////////////
<script>
export default {
name: "auth",
data(){
return {
msg:''
}
},
computed: {
_msg: {
set: function(value) {
this.msg = value;
},
get: function() {
return this.msg.replace(/[^0-9]+/g,'')
}
}
}
};
</script>Previous: H5 part of the mobile phone input content only shows the work part
Next: Why do I have to turn off TLS to send mail when using the smtp service of 163s?
vue.js implements specification selection on product details page Click to select version option and click to select color option. Highlight has been selected. How to display the selected version and color html Code < div class= "chose-ck " > : ...
build the project: vue init webpack my-app with vue scaffolding After , I want to introduce css file structure directory main.jsimport what is the reason for this ...
although it is said that the use of webpack webpack-dev-server, and then with babel transcoding, coupled with a variety of loaders and plugins can really be better, targeted to build a development environment. but these configurations take too much ti...
1. The project initialization statement vue init webpack vuex-iview 2.ESLint is preceded by y and followed by n 3. After initialization, cd vuex-iview then npm run dev 4. Next, I reported an error (I posted a full screenshot below). I have tried to re...
as shown in figure I really can t find it. Ask for help ...
use cordova to package the vue project because apk, cannot connect to the network, and network pictures are not displayed ...
suppose a vue-cli single-page application has parent and child components, as well as non-parent-child components. When I click on a child component, that is, by adding a route to a child component (or a non-parent component), the problem arises. What if...
access the project file in www.a.com HMall, which contains static and index.html, but the background image in css cannot be found. The address of the accessed image is www.a.com static icon.png,. The real image address is www.a.com HMall static icon.png...
Environment, version: node: 8.9.3 webpack: 3.6.0 vue: 2.2.2 vue-cli: 2.x webpack is a template that uses vue-cli. After packaging, an error is displayed on the WeChat end of ios, while Android is fine: prompt that there is an error ...
how to imitate the Alipay password pop-up window in the vue single page? ask for advice ...
after I created the webpack template with vue-cli, I wanted to try to use eslint to standardize the code format. then change indent_size = 2 to 4 in the .editorconfig file. found that it didn t work. later found that the code format check is b...
Build complete. Tip: built files are meant to be served over an HTTP server. Opening index.html over file: won t work. after npm run build is generated, it prompts me that I need to run under the http server. How can I set it up so that I can ...
what a waste of time ask why this is caused by Why can t upload pictures, kindly tired ...
node: 8.11.1 npm: 5.6.0 vue: "^ 2.5.2 ", vue-cli@2.9.3 ...
this question has puzzled me all the time import modules into components like this. For example, I have to rely on these things for many components. and then import them one by one. Will you repeatedly package these modules into the code when packi...
now you need to change the style of an element on the page based on the current route when the page jumps to a route. Boss, don t just talk about ideas, but also talk about the specific implementation code. I am relatively bad, a lot of grammar is not ...
question: vue-cli modifies the file under MAC. It doesn t compile automatically, and it doesn t report an error. What s going on here? Action: the webstorm I used turned off the safewrite and it didn t work. Changing the editor won t work. I can t...
the current situation is I finished developing the vue project, packed it into the test environment, specified the xxx.com domain name with nginx to this static file, and then I can access it. the backend uses the tomecat server. When the backend s...
in vue, this is a window departure event. I want to change the style of body through this, but it seems to have misreported . how can I change its style? ...
I ve been learning vue for some time, and it s good to use it for simple project exercises. I just have a question for the time being. Such as the title, is that so? Do you need to pay attention to anything backstage? I have not done anything like this...