Как добавить квиз в React-приложение?

Инструкция для внедрения квиза в React-приложение

Для вставки квиза в React-приложение необходимо:

Перейти во вкладку Установка квиза и выбрать нужный тип установки

Для примера рассмотрим тип установки По кнопке:

После выбора тип установки По кнопке вам необходимо произвести настройки и нажать кнопку Далее

Затем необходимо скопировать Код инициализации

После этого, добавьте скопированный код инициализации в файл “index.html”, где собирается приложение. В результате index.html файл должен выглядеть следующим образом:

Затем необходимо создать компонент “Marquiz.js” со следующим содержимым:

import React, { useEffect } from 'react';

function Marquiz() {
   const Marquiz = window.Marquiz;

   useEffect(() => {
       /* Скрипт добавления */
   }, [])

   return (
      <!-- HTML код квиза -->
   );
}

export default Marquiz;

Переходим обратно в личный кабинет Marquiz

Вместо <!-- HTML код квиза --> добавьте html код

Вместо /* Скрипт добавления */ вставьте содержимое тега <script>:

PS: Но вызов функции производите через глобальную переменную
window, “window.marquiz(...)”

В  результате компонент будет выглядеть следующим образом:

 


👆 На этом пока всё