Блог

Главная - Вопросы по программированию - Vuejs как вызвать событие внешнего скрипта

Vuejs как вызвать событие внешнего скрипта

#javascript #vue.js

#javascript #vue.js

Вопрос:

В my vue -app я хочу включить внешний скрипт из магазина, чтобы при нажатии на товар скрипт запускался и открывал наложение с процессом покупки…

Я пытался к этому:

 <template>
    <div>
        <div v-for="product in products" :key="product.id">
            
          <h1>{{ product.title }}</h1>
           
           // then the code, the shop requires for its overlay to work
           <a href="#" data-fsc-action="Add,Checkout" data-fsc-item-path-value="PRODUCT ID SHOULD BE HERE">Buy now 99$</a>  
           // product id = {{product.id}}
        </div>
    </div>
 </template>

затем я включил тег script, который также предоставляется магазином (по соображениям безопасности я не могу предоставить все это …)

 export default {
  head() {
    return {
      script: [
       {
         id: "fsc-api",
         src: "https://d1f8f9xcsvx3ha.cloudfront.net/...",
         type: "text/javascript",
         "data-storefront": "...",
         "data-popup-closed": "...",
         async: true,
       },
     ],
   };
 },
}

но это ничего не вызывает, и я не знаю, как это решить

кто-нибудь может мне помочь?

Комментарии:

1. fastspring использует DOMContentLoaded, если products он медленный, то элементы не будут там до его срабатывания, вам нужно использовать @click="addProduct('PRODUCT ID SHOULD BE HERE')" затем передать item / id и т. window.fastspring.builder.add(item); Д., Затем добавить один для window.fastspring.builder.viewCart(); .. или вместо размещения скрипта в head, поместите его в dom при монтировании с помощью document.createElement(‘script’)и т.д., также, если его nuxt, захватите продукты и отобразите на стороне сервера, чтобы атрибуты данных были на месте до загрузки domcontent. К сожалению, нет способа повторно инициализировать fastspring, поскольку init не отображается

2. @LawrenceCherone хорошо, полезно знать! Знаете ли вы, какова правильная полезная нагрузка в этом случае? Я продолжаю получать [FastSpring API] (!) Error: Error received: 400 payload-invalid

3. Не знаю, вам нужно проверить документы fastspring.com/docs/passing-sensitive-data-with-secure-requests

Метки: