Сетевые предметы неверно размером в gridstack.jsJavascript

Форум по Javascript
Ответить
Anonymous
 Сетевые предметы неверно размером в gridstack.js

Сообщение Anonymous »

Я пытаюсь отображать группы плиток (или в терминологии gridstack.js, список стеков сетки), где плитки имеют одну из немногих предопределенных размеров.
Мой проект должен отображать 3 плитки/«Сетки» (одна зеленая (большая) и один магента/красный

Изображение 1 < /p>
Но в моем проекте отображается, что вместо этого (что приводит к почти невидимым плиткам): < /p>
Изображение 2 < /p>
В примере ниже, он ничего не отображает (но я не смотрю его на видно и на grid -элементы там есть. Отмечая, что я использую позицию: относительный в стеках сетки (

Код: Выделить всё

.TileGroup.grid-stack
). Если я удалю это свойство, плитки (или элементы стека сетки) отображаются очень большие. Я также делаю ширину: 100%; Высота: 100%; внутри содержимого элемента стека. PrettyPrint-Override ">

Код: Выделить всё

const gridstack = GridStack.init({
alwaysShowResizeHandle: false,
disableResize: false,
margin: `${margin}rem`,
maxRow: options.direction == "horizontal" ? 6 : undefined,
rtl: localeDir == "rtl",
cellHeight: `${small_size.height}rem`,
acceptWidgets(el) {
return div_ref.current!.contains(el);
},
}, group_element);

// Add gridstack widget
const widget_element = gridstack.addWidget({
x: tile.x,
y: tile.y,
w: get_tile_columns(tile.size),
h: get_tile_rows(tile.size),
});
< /code>
Здесь, get_tile_columns () возвращает значение из 1-4 < /p>
/**
* Gets width of tile size in small tiles unit.
*/
function get_tile_columns(size: TileSize): number
{
return size == "large" ? 4 : size == "wide" ? 4 : size == "medium" ? 2 : 1;
}

/**
* Gets height of tile size in small tiles unit.
*/
function get_tile_rows(size: TileSize): number
{
return size == "large" ? 4 : size == "wide" ? 2 : size == "medium" ? 2 : 1;
}
Примечание: я извиняюсь, но я не мог предоставить фрагмент стека, потому что GridStack использует экспорт модуля ES2015 в CDN, и я получаю ошибку, указывающую, что Gridstack не определен.>

Подробнее здесь: https://stackoverflow.com/questions/795 ... idstack-js
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»