Vue.js将所有输入转换为v模型

时间:2018-12-14 23:00:24

标签: vue.js

我只想知道我在做什么是否正确。 目标

这里是转换v模型中的所有输入字段的方法。

现在我正在使用jQuery来做到这一点,并且运行良好。

使用纯vue.js有什么方法吗?

一些注意事项:

  • 我不想使用v-model或类似ref="foo"的html上的任何vue属性。
  • 数据必须位于对象中,我不想预先定义。

谢谢

const vueApp = new Vue({
  el: '#vue-app',
  data: {
    dataForm: {}
  },
  created() {
    $("input").each(function(){
      var $input_name = 'dataForm.' + $(this).attr('name');
      $(this).attr('v-model',  $input_name);
    });
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="vue-app">
  <div class="">
    First Nane : {{ dataForm.firstName }}
  </div>
  <div class="">
    Last Name : {{ dataForm.lastName }}
  </div>

  <div class="">
    <input type="text" name="firstName" value="">
    <input type="text" name="lastName" value="">
  </div>
</div>

0 个答案:

没有答案