Elixir 为什么phoenix liveview更新/分配消息使客户端内容可编辑值恢复？

使用Phoenix live view文档，我添加了一个用于编写实时表单应用程序的live页面。有一个非常简单的演示：

<h2>Hello</h2>

Counter is222: <%= @counter %>
<hr>

<button phx-click="dec">-</button>
<button phx-click="inc">+</button>

<table border="1">
  <tr>
    <th contenteditable="true">Month</th>
    <th>S1</th>
    <th>S2</th>
  </tr>
  <tr>
    <td contenteditable="true">January</td>
    <td contenteditable="true">$100</td>
    <td contenteditable="true">$10220</td>
  </tr>
</table>

问题是

为什么
-
或
+
会影响
的值

反之亦然。它们不影响
的值，相反，它发送上一个状态和更新状态之间的差异，前端应用此差异

LiveView
不知道您使用
contenteditable=“true”
进行的本地更改，因此它会将所有内容重置为其原始状态，只保留更新的
：计数器。要支持
contenteditable=“true”
，您需要将这些
作为数据模型的一部分，以便
LiveView
了解其中的更改。
我最终通过两个步骤解决了问题：

添加
phx update='ignore'
，则不会更新可编辑的内容

在这个阶段，它是$10220

将phoenix_live_视图更新为0.4.1，该版本为
github:phoenixframework/phoenix_live_视图
（锁定提交为：73e9a695eff1d7d21e4cb34ea9894835b3a2fa32），旧版本似乎不支持
phx更新

希望它也能对你有所帮助

谢谢@Aleksei Matiushkin，我将深入了解liveview diff算法。
嗨，作为一名大一新生，我也有一些疑问。为什么liveview如此严格地管理前端？如果不恢复客户端的自定义更改，就不会有更好的性能和灵活性。如果服务器端推送消息，用户编辑某些内容的位置可能会恢复所有编辑。“不是更好吗[…]”-我不是
LiveView
的作者。试着问一下Hi的Chris McCord，我只是测试将td作为数据模型，但它仍然不起作用。我将在稍后的文章中更新Phoenix和LiveView创建者Chris McCord讨论的使用
contenteditable
与LiveView在：
defmodule TicTacWeb.MemberSchedulerLive do
  use Phoenix.LiveView


  def render(assigns) do
    TicTacWeb.PageView.render("member_scheduler.html", assigns)
  end

  def mount(_, socket) do
    {:ok, assign(socket, %{counter: 100})}
  end

  def handle_event("inc", _, socket) do
    {:noreply, update(socket, :counter, fn(x) -> x + 1 end)}
  end

  def handle_event("dec", _, socket) do
    IO.puts("item")
    {:noreply, update(socket, :counter, fn(x) -> x - 1 end)}
  end

end


    ....
    <td contenteditable="true">$100</td>
    <td contenteditable="true" phx-blur="somedata"><%=@somedata%></td>
  </tr>
</table>

  ...
  def mount(_, socket) do
    {:ok, assign(socket, %{counter: 100, somedata: "$001"})}
  end