时间戳

首页 > 解决方案 > 如何向卡片添加 Toast 通知（或类似通知）？

javascript - 如何向卡片添加 Toast 通知（或类似通知）？

问题描述

我正在尝试修改猫快速入门教程以在底部添加一个通知，以便在遇到任何错误时通知用户（例如 toast 通知或类似的东西）。

我有：

function createCatCard(text, isHomepage) {
  if (!isHomepage) {
    isHomepage = false;
  }

  // Use the "Cat as a service" API to get the cat image. Add a "time" URL
  // parameter to act as a cache buster.
  var now = new Date();
  // Replace formward slashes in the text, as they break the CataaS API.
  var caption = text.replace(/\//g, ' ');
  var imageUrl = Utilities.formatString('https://cataas.com/cat/says/%s?time=%s', encodeURIComponent(caption), now.getTime());
  var image = CardService.newImage().setImageUrl(imageUrl).setAltText('Meow')

  // Create a button that changes the cat image when pressed.
  // Note: Action parameter keys and values must be strings.
  var action = CardService.newAction().setFunctionName('onChangeCat').setParameters({text: text, isHomepage: isHomepage.toString()});
  var button = CardService.newTextButton().setText('Change cat').setOnClickAction(action).setTextButtonStyle(CardService.TextButtonStyle.FILLED);
  var buttonSet = CardService.newButtonSet().addButton(button);

  // Create a footer to be shown at the bottom.
  var footer = CardService.newFixedFooter().setPrimaryButton(CardService.newTextButton().setText('Powered by cataas.com').setOpenLink(CardService.newOpenLink().setUrl('https://cataas.com')));

  // Assemble the widgets and return the card.
  var section = CardService.newCardSection().addWidget(image).addWidget(buttonSet);
  var card = CardService.newCardBuilder().addSection(section).setFixedFooter(footer);

  if (!isHomepage) {
    // Create the header shown when the card is minimized,
    // but only when this card is a contextual card. Peek headers
    // are never used by non-contexual cards like homepages.
    var peekHeader = CardService.newCardHeader().setTitle('Contextual Cat').setImageUrl('https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png').setSubtitle(text);
    card.setPeekCardHeader(peekHeader)
  }

  var act = CardService.newActionResponseBuilder().setNotification(CardService.newNotification().setText('bob here').setType(CardService.NotificationType.INFO));
  card.addCardAction(act);


  return card.build();
}

（我添加的唯一部分是倒数第二行）。但是，当我运行代码时，我得到：

Cannot find method addCardAction(CardService.ActionResponseBuilder). [line: 62, function: createCatCard, file: Common]

编辑：

我也尝试过card.setNotification(CardService.newNotification().setText('bob here').setType(CardService.NotificationType.INFO));，但我得到了TypeError: Cannot find function setNotification in object CardBuilder. [line: 62, function: createCatCard, file: Common]

EDIT2：我也试过

card.newNotification().setText('bob here').setType(CardService.NotificationType.INFO);

但我明白了TypeError: Cannot find function newNotification in object CardBuilder. [line: 63, function: createCatCard, file: Common]

标签： javascriptgoogle-apps-scriptgoogle-drive-apigoogle-workspacecard

解决方案

该card对象属于 type CardBuilder，并且根据文档，它没有addCardAction,setNotification或newNotification方法，这就是您尝试执行的操作不起作用的原因。有一个Notification类，您可以在用户与 UI 元素交互时使用它。” 以下是猫快速入门代码的示例：

function onChangeCat(e) {
    ... // <-- omitted for brevity
    var navigation = CardService.newNavigation()
        .updateCard(card);
    var actionResponse = CardService.newActionResponseBuilder()
        .setNavigation(navigation);
    const failed = someOperationThatMightFail();
    if (failed) {
         actionResponse
        .setNotification(CardService.newNotification()
        .setText("PANIC"));
    }
    return actionResponse.build();
}

编辑：如果您想使用现有卡指示失败，我相信它必须使用实际的 Card 对象本身来完成。该类Notification只能用作对与 UI 元素交互的响应。用对象指示失败的一个优点Card是用户可以使用信息，直到问题得到解决，这与Notification最终会从 UI 中消失的情况不同。以下是如何使用现有卡指示故障的示例：

function createCatCard(text, isHomepage) {
    ...
    // Create a footer to be shown at the bottom.
    var footer = CardService.newFixedFooter().setPrimaryButton(CardService.newTextButton().setText('Powered by cataas.com').setOpenLink(CardService.newOpenLink().setUrl('https://cataas.com')));

    // Assemble the widgets and return the card.
    var section = CardService.newCardSection();

    const failed = someOperationThatMightFail();
    if (failed) {
        var textParagraph = CardService.newTextParagraph();
        textParagraph.setText('Something went wrong, please try again later');
        section
            .addWidget(buttontextParagraphSet);
    } else {
        section
            .addWidget(image)
            .addWidget(buttonSet);
    }

    var card = CardService.newCardBuilder().addSection(section).setFixedFooter(footer);

    if (!isHomepage) {
        // Create the header shown when the card is minimized,
        // but only when this card is a contextual card. Peek headers
        // are never used by non-contexual cards like homepages.
       var peekHeader = CardService.newCardHeader().setTitle('Contextual Cat').setImageUrl('https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png').setSubtitle(text);
       card.setPeekCardHeader(peekHeader)
    }
    ...
}

推荐阅读