vue表单修饰符有哪些

vue中的表单修饰符有：1.lazy，将输入框的值与数据转变在change事件中同步；2.number，将输入框内的字符串转换成数字；3.trim，将输入框内中前后的空格去掉；

vue中的表单修饰符有以下几种

1.lazy修饰符

vue中lazy修饰符的作用是将输入框的值与数据转变在change事件中同步。

<input v-model.lazy="name">
<p>{{ name }}</p>
<script>
    new Vue({
        el: '#app',
          data: {
             name: "请输入姓名："
         }
    })
</script>

2.number修饰符

vue中number修饰符的作用是将输入框内的字符串转换成数字。

<input v-model.number="number">
<p v-on:click="showMsg">{{ number }}</p>
<script>
    methods: {
        showMsg: function() {
             console.log(this.number);
             console.log(typeof(this.number))
         }
      }
</script>

3.trim修饰符

vue中trim修饰符的作用是将输入框内中前后的空格去掉。

<input v-model.trim="search_text">
<p v-on:click="showContent"> {{ search_text }}</p>
<script>
    showContent: function() {
        console.log( "a" + this.search_text)
    }
</script>

亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>