Оформление и SPA

Оформление

ads.setAppearance({
  colorScheme: "dark",
  surface: "inline",
  bodyFontSize: 14,
  mediaHeight: 130
});

Размеры, px

Значения за пределами диапазона ограничиваются ближайшей границей. В режиме inline скругление равно 0, отступы доступны от 0 до 16 px. Высота строки — не меньше 1,35 размера текста; название бренда — не меньше bodyFontSize − 1.

Ширину задаёт контейнер приложения; высота рассчитывается по содержимому. Стили карточки изолированы от CSS страницы.

React

Передайте компоненту ранее созданный клиент ads. При удалении контейнера вызовите unmount().

Запрашивайте рекламу после завершения ответа, когда question и answer больше не меняются. Повторный вызов с тем же requestId должен содержать те же параметры.

function AdSlot({ ads, messageId, question, answer }) {
  const ref = React.useRef(null);

  React.useEffect(() => {
    const target = ref.current;
    void ads.requestAd({
      target,
      requestId: messageId,
      context: { question, answer }
    });
    return () => ads.unmount(target);
  }, [ads, messageId, question, answer]);

  return <div ref={ref} style={{ maxWidth: 480 }} />;
}

Жизненный цикл