Вот как я добавляю виджет
<div class="grid-stack">
<div class="grid-stack-item" v-for="widgetOptions in widgetList"
:key="widgetOptions.id"
:id="widgetOptions.id"
data-gs-height="3"
data-gs-width="2"
data-widget-id="widgetOptions.id">
<div class="grid-stack-item-content border">
<component :is="widgetOptions.data.template"
:boundData="widgetOptions.data"
:widgetId="widgetOptions.id"
:ref="widgetOptions.id"></component>
</div>
</div>
</div>
После этого я делаю виджет в смонтированном событии
var options = {
cellHeight: 80,
verticalMargin: 5
}
$('.grid-stack').gridstack(options);
this.gridStack = $('.grid-stack').data("gridstack");
let element = document.getElementById(id);
this.gridStack.makeWidget(element);
Это создает элемент grid-stack, но его нельзя перетаскивать и не изменяемый размер