external_render

рендерит внешний компонент в DOM

Example

import ReactDOM from 'react-dom';
import React from 'react';
 
gantt.config.columns = [
    {name:"text",       label:"Название задачи",  tree:true, width:"*"},
    {name:"start_date", label:"Время начала", align: "center"},
    {name:"duration",   label:"Продолжительность",   align: "center"},
    { 
        name:"external", label:"Элемент 1", align: "center",
        onrender: (item, node) => {
            return <DemoButton
                    text="Редактировать 1"
                    onClick={() => alert("Элемент как React компонент")}
                    />
        }
    }
];
 
gantt.config.external_render = { 
    // проверяет, является ли элемент React элементом
    isElement: (element) => {
        return React.isValidElement(element);
    },
    // рендерит React элемент в DOM
    renderElement: (element, container) => {
        ReactDOM.render(element, container);
    }
};

external_render - это объект со следующими свойствами:

• isElement (element): boolean - функция, которая используется для проверки предоставленного элемента. Использует следующий аргумент:
  • element - (any) - объект, который возвращается функцией onrender.
• renderElement (element, container): void - функция, используемая для применения нативных методов для рендеринга нативных компонентов. Использует следующие аргументы:
  • element - (any) - объект, который возвращается функцией onrender.
  • container - (HTMLElement) - элемент DOM, к которому будет прикреплен нативный компонент.

добавлено в v7.1

К началу