javascript - libphonenumber-js:“未捕获的TypeError:用于解析的文本必须是字符串”

我想将libphonenumber-js软件包（https://www.npmjs.com/package/libphonenumber-js）与Vuejs一起使用，但是有一个我不明白的问题。

我导入包：

import { parsePhoneNumberFromString } from 'libphonenumber-js';

Vue.use(parsePhoneNumberFromString);

在我的组件中，我尝试使用计算出的格式来格式化用户的电话号码：

phoneNumberFormatting: function() {
  const rawPhoneNumber = parsePhoneNumberFromString(this.phoneNumber);
  return rawPhoneNumber;
}

phoneNumber在这里：

function defaultData() {
  return {
    open:            false,
    maxLength:       25,
    playlisName:     '',
    loader:          false,
    userCreated:     false,
    step:            'login',
    phoneNumber:     '',
    formattedNumber: ''
  }
}

而且，目前，我只想显示格式化的数字：

              <div class="input-group">
              <input v-model="phoneNumber" id="phoneNumber" placeholder="[phone]" class="form-control">
                <div class="input-group-append">
                  <span class="input-group-text">{{phoneNumberFormatting}}</span>
                </div>
              </div>

但是在我的JavaScript控制台中，出现错误：

Uncaught TypeError: A text for parsing must be a string.

这是parsePhoneNumber.js中存在问题的地方：

export function normalizeArguments(args) {
    var _Array$prototype$slic = Array.prototype.slice.call(args),
        _Array$prototype$slic2 = _slicedToArray(_Array$prototype$slic, 4),
        arg_1 = _Array$prototype$slic2[0],
        arg_2 = _Array$prototype$slic2[1],
        arg_3 = _Array$prototype$slic2[2],
        arg_4 = _Array$prototype$slic2[3];

    var text = void 0;
    var options = void 0;
    var metadata = void 0;

    // If the phone number is passed as a string.
    // `parsePhoneNumber('88005553535', ...)`.
    if (typeof arg_1 === 'string') {
        text = arg_1;
    } else throw new TypeError('A text for parsing must be a string.');

    // If "default country" argument is being passed then move it to `options`.
    // `parsePhoneNumber('88005553535', 'RU', [options], metadata)`.
    if (!arg_2 || typeof arg_2 === 'string') {
        if (arg_4) {
            options = arg_3;
            metadata = arg_4;
        } else {
            options = undefined;
            metadata = arg_3;
        }

        if (arg_2) {
            options = _extends({ defaultCountry: arg_2 }, options);
        }
    }
    // `defaultCountry` is not passed.
    // Example: `parsePhoneNumber('[phone]', [options], metadata)`.
    else if (isObject(arg_2)) {
            if (arg_3) {
                options = arg_2;
                metadata = arg_3;
            } else {
                metadata = arg_2;
            }
        } else throw new Error('Invalid second argument: ' + arg_2);

    return {
        text: text,
        options: options,
        metadata: metadata
    };
}

所以在这里：

    // If the phone number is passed as a string.
    // `parsePhoneNumber('88005553535', ...)`.
    if (typeof arg_1 === 'string') {
        text = arg_1;
    } else throw new TypeError('A text for parsing must be a string.');

我不明白，因为即使我更换

const rawPhoneNumber = parsePhoneNumberFromString(this.phoneNumber);
return rawPhoneNumber;

通过

const rawPhoneNumber = parsePhoneNumberFromString('[phone]')
return rawPhoneNumber.number;

像在文档中一样，我仍然有错误。

任何的想法？

最佳答案

在此处挖掘插件文件：

export function parsePhoneNumberFromString()
{
  var parameters = Array.prototype.slice.call(arguments)
  parameters.push(metadata)
  console.log(parameters) //<= here
  return parsePhoneNumberFromStringCustom.apply(this, parameters)
}

似乎您将所有Vue上下文作为第一个参数而不是字符串传递。

从main.js中删除Vue.use(parsePhoneNumberFromString)应该可以解决此问题。