将 NuxtJS 用于 Zoho CRM 小部件答案

【问题标题】：Using NuxtJS for Zoho CRM Widgets将 NuxtJS 用于 Zoho CRM 小部件
【发布时间】：2020-03-02 01:14:12
【问题描述】：

Zoho CRM 有一个叫做小部件的东西来扩展它的功能。使用小部件功能，您可以直接将 UI 组件嵌入到 CRM 中，并使用来自第三方应用程序的数据按照要求执行操作。

小部件基本上是一个 HTML 文件，一旦触发自定义按钮，它就会在弹出窗口中加载。要从 Zoho CRM 存储/检索数据，您需要在 HTML 文件中加载 jQuery 及其JS SDK。

最基本的 HTML 文件如下所示：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script>
    <script src="https://live.zwidgets.com/js-sdk/1.0.5/ZohoEmbededAppSDK.min.js"></script>
    <title>Document</title>
  </head>
  <body>

    <script>
      ZOHO.embeddedApp.on("PageLoad",function(data) {
        console.log(data);
        //Custom Business logic goes here
      });

      ZOHO.embeddedApp.init();
    </script>
  </body>
</html>

在此文件中console.log(data) 将记录有关触发小部件的页面的信息。在潜在客户页面上，它会记录有关该潜在客户的信息，例如 id。

需要在//Custom Business logic goes here 处使用存储/检索数据的功能。

在这个小部件中获取所有潜在客户的代码如下所示：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script>
    <script src="https://live.zwidgets.com/js-sdk/1.0.5/ZohoEmbededAppSDK.min.js"></script>
    <title>Document</title>
  </head>
  <body>

    <script>
      ZOHO.embeddedApp.on("PageLoad",function(data) {
        ZOHO.CRM.API.getAllRecords({Entity:"Leads"})
          .then(function(data){
            console.log(data)
          })
      });

      ZOHO.embeddedApp.init();
    </script>
  </body>
</html>

因为我需要创建多个 Zoho Widget 并在我想到使用 NuxtJS 的每个 Widget 上使用相同的 Vue 组件。我成功创建了 Vue 组件，但我不知道如何合并 Zoho 的 JS SDK。

有没有人可以给我一些建议如何使这项工作？谢谢！

【问题讨论】：

标签： javascript vue.js nuxt.js zoho

【解决方案1】：

为什么不在您的 html 的外部文件中包含 SDK 函数，您可以在其中调用 SDK api 中的所有方法？

只需将您的 SDK 导入到 html 的标题中。

【讨论】：