phoenix-framework - Phoenix AlpineJs 不跟踪分配

Question

我无法让 Alpinejs 在我的实时组件中“阴影”和“跟踪”分配。例如，使用Integrating Phoenix LiveView with JavaScript and AlpineJS中的示例我没有得到预期的行为。我的“分配计数”出现并按应有的方式递增/递减，但对于“高山计数”我一无所获。编辑添加：我现在实际上注意到“高山计数”实际上在加载时正确渲染了一秒钟，但之后消失了。phx-update="ignore"确实让它保持不变，但我失去了增加/减少计数的能力。

 <div id="counter"
      x-data="{count: <%= @count %>}">
  <h1>The assigns count is: <span><%= @count %></span></h1>
  <h1>The alpine count is: <span x-text="count"></span></h1>
  <button phx-click="decrement" phx-target=<%= @myself %> %>> Decrement </button>
  <button phx-click="increment" phx-target=<%= @myself %>> Increment </button>
</div>

同样，我有以下代码myHookOnWindow.myRenderData(data)运行良好并呈现数据，但是$watch('data', () => console.log('data changed'))当数据更改时没有任何反应。在这种情况下，数据是 JSON，因为如果我使用常规地图或列表，它会报错。

<canvas
  id="MyChart"
  phx-hook="myHook"
  x-data="{data: <%= @data %>}"
  x-init="
    myHookOnWindow.myRenderData(data)

    $watch('data', () => console.log('data changed'))
  "
>
</canvas>

标签： phoenix-frameworkalpine.js