Question

我的页面上有一个select元素。该选择元素选择产品的不同变体。所有这些产品的价格相同，但是我想在发票上注明选择了哪种产品。我正在使用PayPal智能按钮在页面上集成结帐功能。假设我有以下内容：

<select id="product-select">
    <option value="product-A" selected> Product A </option>
    <option value="product-B"> Product B </option>
    <option value="product-C"> Product C </option>
</select>

<div id="paypal-button-container"> </div>

<script>
  paypal.Buttons({
    createOrder: function(data, actions) {
      return actions.order.create({
        purchase_units: [{
          amount: {
            value: '50'
          },
          items: [{
            unit_amount: {
                value: '50'
            },
            quantity: '1',
            name: 'Product A',
          }],
        }],
      });
    }
  }).render('#paypal-button-container');
</script>

当用户将所选选项更改为产品B或产品C时，我是否需要在选择更改时重新呈现“贝宝”按钮？如果是这样，我该如何处置旧的？

Answer 1

您确实需要重新渲染。

保存对对象的引用，而不是立即调用.render（）。

var myButton = paypal.Buttons({...});
myButton.render('#paypal-button-container');

//things happen, user makes changes to purchase_units array
myBytton.close();

//call into the above with the new info

Answer 2

重新渲染的更好替代方法似乎是让“ value：”键的value是一行JavaScript，它使用document.getElementById（）。value或类似的值来获取select的当前值。显然，这是可行的，因为仅在单击时才立即调用'createOrder'

......

如果要重新渲染（不需要），这是您要这样做的方式：

保存对对象的引用，而不是立即调用.render（）。

var myButton = paypal.Buttons({...});
myButton.render('#paypal-button-container');

//things happen, user makes changes to purchase_units array
myBytton.close();

//call into the above with the new info

选择更改后，我是否需要重新渲染PayPal的智能按钮？

2 个答案: