An error occurs when using v-bind in Vue3

[sooooooooooooooooootheby]

The code is as follows, Console display There are no slots defined in your root element

[sooooooooooooooooootheby]

I tried to improve the js code, but there were new problems.

The html above is rendered by a static array without any problems and is functioning normally. The problem is that the following html, rendered by the data passed by the server, causes the following error

This is the data by server

[TahaSh]

@sooooooooooooooooootheby Hi! This issue happens because Vue updates the DOM on the next tick after a data property is updated. To make sure all the elements are added to the DOM before using Swapy, you need to wait for the next tick. In your code, wrap handleSwapy() with nextTick, like this:

this.$nextTick(() => {
  this.handleSwapy()
})

Let me know if you have any questions!

[sooooooooooooooooootheby]

Thank you very much. I didn't learn enough about vue.