Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 30.04.2018, 10:05   #1
SnapeEye
Пользователь
 
Регистрация: 08.11.2014
Сообщений: 43
Восклицание Render произвольной верстки

Доброго времени суток!

Есть задумка рендерить заранее заготовленную верстку в добавок к имеющейся базовой через React.
Есть такие входные данные:
  • строка с уже готовой версткой (block): "<div id="test">test markup</div>"
  • объект со стилями (styling): { fontSize: '12px', color: '#123456' }

Может кто помочь разобраться?

P.S. уже пробовал следующие методы (получаю 109 ошибку реакта: рендер чего-то, что рендерить нельзя... массив или что-то другое типо...)

1) Отрендерить каждый отдельно, а потом всё в один блок
Код:
let children = [];
        for (let element in block) {
            let newBlock = React.createElement(block[element], {
                style: styling[element],
                key: element,
            });
            children.push(newBlock);
        }
        
        return React.createElement('div', {className: "content"}, children);
2) Сразу делать компонент со строки с версткой всех блоков (заранее загнал все блоки в строку markup)
Код:
var customBlock = React.createClass({
            render() {
                return({this.props.markup});
            }
        });
3) Использовал модуль ReactHtmlParser, который делает реакт компонент с html строки.
Код:
let markup = '';
        for (let element in block) {
            markup += block[element];
        }
        return ReactHtmlParser(markup);
4) Создание компонента следующим образом:
Код:
const Block = ({blocks}) => (
            <div>
                {blocks.map(el => (
                    el
                ))}
            </div>
        );
        return <Block blocks={Object.values(block)} />
Ничего из этого не взлетело. Идёт ошибка 109:
[NO PARSE]Component.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.[/NO PARSE]

Подебажил... заметил, что на другие, базовые сущности создается нормальный объект, а на динамические чего-то делается нормальный объект, но оборачивается в ещё один объект body и реакт при валидации не пропускает, т.к. двойная вложенность и не может проверить валидность типа...
SnapeEye вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц



Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
LocalReport.Render, ошибка - An error occurred during local report processing Patri C# (си шарп) 1 16.11.2015 13:31
Проблема табличной верстки John_Doe HTML и CSS 2 14.07.2013 01:43
Странные традиции верстки MyLastHit HTML и CSS 2 12.06.2012 20:52
Код резиновой верстки nickostyle HTML и CSS 1 08.12.2010 04:22
OpenGL render to target theos Gamedev - cоздание игр: Unity, OpenGL, DirectX 1 27.05.2008 18:03