Javascript 无法读取属性'；stripeTokenHandler'；未定义的vuejs组件的

我正在用vuejs构建一个支付表单，其中包括stripe js。 这是我的卡片元素：

            <!-- CARD form -->
            <label class="mt-5 font-20px"> Tarjeta </label>
            <div class="mt-4"> Número </div>
            <div class="row mt-2">
              <div class="col-md-12">
                <div id="card-number-element" class="form-control rounded-pill" placeholder="**** **** **** ****"> </div>
              </div>
            </div>

            <div class="row">
              <div class= "col-md-6 mt-3">
                <span> Nombre de la Tarjeta </span></br>
                <input type="input" id="card-name-element" class="form-control rounded-pill" placeholder ="Juan Pérez"> </input>
              </div>

              <div class= "col-md-3 col-6 mt-3">
                <span> Expiración </span></br>
                <div id="card-expiry-element" class="form-control rounded-pill" placeholder ="MM / YY"> </div>
              </div>

              <div class= "col-md-3 col-6 mt-3">
                <span> CCV </span></br>
                <div id="card-cvc-element" class="form-control rounded-pill" placeholder ="***"> </div>
              </div>
            </div>

            <div class="row mt-3">
              <div id="card-error text-danger"></div>
              <div id="card-success">
                Your Stripe token is <span class="token text-success"></span>
              </div>
            </div>

一切正常，可以检索并返回条纹卡令牌。 然后调用：this.stripeTokenHandler（result.token.id）将令牌和数据发送到服务器

    submitForm(e) {
      e.preventDefault();
      this.submitted = true;

      if (this.formInvalid()) {
        return;
      }
      var options = {
        name: document.getElementById('card-name-element').value,
      };

      stripe.createToken(cardNumberElement, options).then(function(result) {
        var successElement = document.querySelector('.card-success');
        var errorElement = document.querySelector('.card-error');

        if (result.token) {
          successElement.querySelector('.token').textContent = result.token.id;
          this.stripeTokenHandler(result.token.id);
        } else if (result.error) {
          errorElement.textContent = result.error.message;
        }

        console.log(this)
      });


      if (this.cardError) {
        return;     
      }
      // this.nextStep();
    },

此调用从不工作，因为它总是显示错误：

Finaliza.vue:415 Uncaught (in promise) TypeError: Cannot read property 'stripeTokenHandler' of undefined

---

你能帮我一下吗，我哪里错了？

不知怎么的这个变量在条带范围内变得未定义。所以我可以通过在条带回调之外保存这个变量来解决这个问题

      var context = this;
      stripe.createToken(cardNumberElement, options).then(function(result) {
        var successElement = document.querySelector('.card-success');
        var errorElement = document.querySelector('.card-error');

        if (result.token) {
          successElement.querySelector('.token').textContent = result.token.id;
          context.stripeTokenHandler(result.token.id);
        } else if (result.error) {
          errorElement.textContent = result.error.message;
        }
      });

---

元素this.stripeTokenHandler（result.token.id）；，这没有stripeTokenHandler@脾气暴躁你什么意思？原因是此处未定义“this”，而不是我的vue组件。我不知道为什么，也不知道如何解决。你解决了，这是“这个”的问题；

      var context = this;
      stripe.createToken(cardNumberElement, options).then(function(result) {
        var successElement = document.querySelector('.card-success');
        var errorElement = document.querySelector('.card-error');

        if (result.token) {
          successElement.querySelector('.token').textContent = result.token.id;
          context.stripeTokenHandler(result.token.id);
        } else if (result.error) {
          errorElement.textContent = result.error.message;
        }
      });