vue.js - vue js v-model 可以添加多个修饰符吗？

Question

您可以添加多个修饰符吗？

例如：

<input v-model.trim="name.first"/>
<input v-model.lazy="name.first"/>

沿线的东西

<input v-model.{lazy,trim}="name.first"/>

可能还是不可能？是的！

后续问题：它背后的概念是什么？我知道它有效，但“.lazy.trim”听起来像修剪是惰性对象的一部分

标签： vue.js

Answer 1

是的，我们可以为 Vue js v-model 添加多个修饰符。

new Vue({
  'el': '#app',
  data: {
    val: 'default value',
    num: 0,
    trimExample: ''
  },
  methods: {
    handleBtnClick() {
      console.log(this.trimExample, this.num)
    }
  }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>


<div id="app">

  <input type="text" v-model.lazy="val">
  <br> {{val}}

  <br><br>
  <input type="text" v-model.number="num">
  <input type="text" v-model.trim.lazy="trimExample">
  <button v-on:click="handleBtnClick">
check console
</button>

</div>

小提琴链接