Proper AlpineJS Integration with Liveview

Questions & Help Questions
, ,
12

Hey, did you find any issues to that problem? I got the same and the only solution I found is:

let liveSocket = new LiveSocket("/live", Socket, {
  params: { _csrf_token: csrfToken },
  dom: {
    // Initialize Alpine on newly added nodes
    onNodeAdded(node) {
      if (node._x_dataStack) {
        window.Alpine.initTree(node)
      }
    },
    // Preserve and reinitialize Alpine state on element updates
    onBeforeElUpdated(from, to) {
      if (from._x_dataStack) {
        window.Alpine.clone(from, to)
        window.Alpine.initTree(to)
      }
    }
  }
})