Vue.js + jQuery 输入掩码不起作用答案

【问题标题】：Vue.js + jQuery inputmask not workingVue.js + jQuery 输入掩码不起作用
【发布时间】：2018-07-31 21:32:16
【问题描述】：

我正在尝试将 inputmask 插件用作 Vue.js 指令，但出现以下错误：

$(...).inputmask is not a function

传递此错误后，我需要将输入值更新为模型（data.amount）。

这是代码（JsFiddle：https://jsfiddle.net/rL09zg5c/3/）

//HTML
<div id="app" class="container">
  <h1>
    Vue {{ vueVersion }}
  </h1>
  <form>
    <h3>
Currency:
    </h3>
    <input type="text" v-model="amount" v-input-mask/>
        <h4>
        Entered: {{ amount }}
        </h4>
  </form>
</div>

//JS
onload = function() {
  Vue.directive('input-mask', {
    bind: function(el, obj, vModel) {
            $(el).inputmask({
        prefix: 'R$ ',
        alias: 'numeric',
        allowMinus: false,
        groupSeparator: '.',
        radixPoint: ',',
        autoGroup: true,
        digits: 2,
        digitsOptional: false,
        placeholder: '0',
        rightAlign: false,
      });
    }
  })

  var vm = new Vue({
    el: '#app',
    data: {
      vueVersion: Vue.version,
      amount: ""
    }
  });
}

谢谢。

【问题讨论】：

您似乎没有正确包含库文件。
@Sphinx 你到底是什么意思？我错过了一些库文件吗？

标签： jquery vue.js jquery-inputmask

【解决方案1】：

我认为以下代码会对您有所帮助。 GitHub

用法：

Vue.use(Inputmask)

<input v-inputmask="'9999'">

<input v-inputmask="mask">

【讨论】：

您是否有使用此包装器传递输入掩码选项对象的示例，而不是仅在v-input 属性中声明掩码？
我更新了答案。当您使用字符串时，您必须使用引号，否则它将被评估为变量，您可以免费使用两者。所以它可以很容易地动态化。
谢谢，但这仍然不是我需要的。我不想为屏幕上的每个输入传递属性中的选项。我只想设置一次掩码选项，然后让它适用于所有输入。
然后你必须创建组件，当你用一些字符串作为输入包装 v-inputmask 时。