檢視原始碼 變更日誌

0.20.17 (2024-06-21)

錯誤修正

  • 修正格式器在 script 標籤中加入換行

0.20.16 (2024-06-20)

錯誤修正

  • 修正 0.20.15 引發錯誤，導致在等待確認時，錯誤修正表單元素

0.20.15 (2024-06-18)

強化功能

  • 在呈現輸入值名為「id」時，發出警告
  • 發現不相符的 client 與 server 版本時，發出警告
  • 允許表單回復在嵌套 LiveViews 中運作
  • 允許使用表單/3 和輸入表單外的輸入
  • 允許設定頁面標題為空白
  • 修正 Elixir 1.17 的警告

錯誤修正

  • 修正屬性於重設後，現有的串流項目沒有被更新
  • 修正嵌套的 LiveView 在串流中會在重設後變成空白
  • 修正 phx-mounted 啟動兩次，第一次在不活躍的呈現，第二次在活躍的呈現，導致在 LiveComponent 尚未掛載時發生錯誤
  • 修正 JS.toggle_class 在與轉場一起使用時發生的錯誤
  • 修正 phx-debounce=blur 在某些情況下，不正確地將變更事件傳送到下一個頁面
  • 修正在轉場仍在執行的同時，銷毀 Live Components 的競爭狀況
  • 修正使用 Bandit 時，斷開 LiveSocket 時重新整理頁面
  • 修正格式器在不適當的時候，將 <% 更改為 <%=
  • 修正更新的表單值在某些情況下，使用 phx-trigger-action 時沒有被發送
  • 修正 phx-viewport 繫結，當 html 或 body 元素具有溢位屬性

廢除功能

  • 廢除 live_flash，使用 Phoenix.Flash.get 取代
  • 廢除 push_redirect，使用 push_navigate 取代

移除先前已廢除的功能

  • phx-capture-click 已被移除（在 0.17.0 中已廢除）
  • live_component/2 和 live_component/3 輔助程式（而非功能組件）已移除

0.20.14 (2024-03-13)

錯誤修正

  • 修正因可選擇的 Floki 依賴而導致的警告

0.20.13 (2024-03-12)

錯誤修正

  • 修復 LiveComponent 渲染錯誤導致元素在 LiveComponent 子項被移除並由伺服器新增時消失

功能增強

  • 傳遞給 assign_async / start_async 的函式中存取 socket 時發出警告

0.20.12 (2024-03-04)

功能增強

  • Phoenix LiveView 需使用 Elixir v1.13+

錯誤修正

  • 不要將遠程測量資料發送為 Logger 事件，這樣可以避免意外將資料複製到其他程序
  • 確保 LiveViewTest 不會在具有特殊字元（例如問號）的 ID 上崩潰
  • 修復 LiveViewTest 無法在具有特定串流的頁面上執行已連線掛載的錯誤

0.20.11 (2024-02-29)

錯誤修正

  • 修復自動上傳具有無效條目的錯誤，錯誤會錯誤地繼續進行表單提交而不是停止，導致進行中的條目錯誤
  • 修復移動到有效狀態（例如落在 max_entries 內）後提交上傳條目無法上傳的錯誤
  • 修復 TagEngine 子句警告

0.20.10 (2024-02-28)

錯誤修正

  • 修復已取消上傳被重新新增的錯誤
  • 修復先前已提交的無效上傳條目的表單提交導致錯誤，而不是預先傳送新的上傳條目
  • 修復 HTML 格式設定器不尊重 script 標籤的 phx-no-format

功能增強

  • 為函式元件呼叫的呼叫方位置新增其他 HEEx 偵錯註解
  • 若復原事件失敗，則放棄表單復原

0.20.9 (2024-02-19)

錯誤修正

  • 修復 LiveViewTest 中的錯誤，其中 phx-update="ignore" 容器會動態新增到 DOM 中

0.20.8 (2024-02-19)

錯誤修正

  • 修復表單包含多個 <.live_file_input> 時的即時上傳器問題
  • 修復重新新增串流項目時 phx-remove 在不應觸發移除的情況下觸發移除
  • 修復嘗試重新排列 DOM 中不存在的元素的 js 錯誤

功能增強

  • 當在 LiveViewTest 中更新屬性時，讓 LiveViewTest 與 phx-update="ignore" 時 JavaScript DOM 修補行為保持一致

0.20.7 (2024-02-15)

錯誤修正

  • 修復在某些情況下第一個修補程式中 phx-skip 容器遺漏至 DOM（#3117）
  • 修復 phx-feedback-for 在某些情況下無法正確更新（#3122）

0.20.6 (2024-02-14)

錯誤修正

  • 修復 LiveViewTest 中串流項目被排除的錯誤
  • 修正串流項目無法正確更新嵌套串流或 LiveComponents
  • 修正因防反彈/失去焦點而導致傳送出意外事件的退步

0.20.5 (2024-02-08)

已過期

  • 在先前的版本中過期 phx-feedback-group，目標是將回饋處理移到 Elixir 並移除 DOM

錯誤修正

  • 修正錯誤的 phx-debounce 失去焦點事件被發送
  • 修正 UNIX 檔案系統下 WSL 上的專案中 open_browser 無法運作
  • 比對 LiveViewTest 中的瀏覽器串流插入順序行為
  • 修正當元素部分隱藏時無法運作的 phx-click-away
  • 修正某些狀況下未套用的 phx-feedback-for 類別
  • 修正表單提交者在某些狀況下無法作為鍵值對傳送
  • 修正空表單參照導致某些 DOM 程式碼區塊產生錯誤

0.20.4 (2024-02-01)

錯誤修正

  • 修正黏著 LiveViews 中的 phx-remove
  • 修正 phx-disabled-with 在 diff 驗證為空時無法還原按鈕的禁用狀態
  • 修正串流重設未正確排序項目
  • 在 cancel_async 中傳送 {:shutdown, :cancel} 給 handle_async/3
  • 當子 LiveViews 尚未掛載時，禁止子事件浮現至根 LiveView
  • 修正對串流項目呼叫兩次 phx-mounted
  • 當串流項目已存在時，切勿移動現有的項目（改為使用 stream_delete，然後再使用 stream_insert）
  • 修正當伺服器將被客戶端裁剪的元件新增回來時，中斷 Live 元件呈現（＃3026）
  • 允許從上傳進度回呼中重新導向
  • 修正重設串流時略過嵌套元件
  • 修正略過 LiveComponents 中的嵌套元件
  • 修正大量插入時未正確套用串流限制
  • 修正錯誤呼叫 click-away 於表單提交
  • 修正 LiveViewTest 和瀏覽器串流實作間的不一致處
  • 修正當有多個同名輸入時重新套用 phx-feedback-for
  • 確保 phx-update="ignore" 行為一致：伺服器對元素內容和屬性的更新都會被忽略，但資料屬性除外

加強功能

  • 新增 JS.toggle_class
  • 新增 JS.toggle_attribute
  • 在選擇項已對焦時，強迫更新因伺服器而變更的選擇項
  • 針對處理複合輸入群組的回饋新增 phx-feedback-group
  • 對插槽新增 validate_attrs
  • 在可捲動容器中支援 phx-viewport 繫結
  • 嘗試從已終止的用戶端直接進行導覽時執行用戶端重新導向以避免額外的往返
  • 允許名稱／值屬性中的常規按鈕傳送表單事件並調整動態表單文件以反映此情況
  • 允許 live_file_input 中的表單屬性

移除先前不建議使用的功能

  • live_component/2 和 live_component/3 輔助程式（而非功能組件）已移除

0.20.3 (2024-01-02)

錯誤修正

  • 修正導覽後 phx-viewport 繫結失敗的問題
  • 在 LiveViewTest 中保留串流中附加項目順序
  • 在將串流重新設定為現有的項目組合時修正用戶端上項目的順序

增強功能

  • 支援已終止檢視中的 JS.push

0.20.2 (2023-12-18)

錯誤修正

  • 修正提交進行中上傳的表單時產生的 JavaScript 錯誤
  • 修正當以基於選取器的目標作為 phx-submit 或 phx-change 使用時，JS 指令 :target 無法運作
  • 修正 JS.focus() 無法讓負 tabindex 聚焦
  • 修正 LiveViewTest 在串流重新設定後無法移除項目
  • 修正 phx-window-blur 和 phx-window-focus 事件未觸發
  • 修正 SVG 錨點連結在按一下時擲出錯誤

增強功能

  • 加快 DOM 程式碼修補效能 3-30 倍 🔥
  • 支援 handle_async 生命週期回呼
  • 擴充 phx-click-away 的可視性檢查功能，以改善處理元素在視窗中是否可見
  • 允許 JS.patch 和 JS.navigate 使用 render_click 進行測試
  • 支援 :supervisor 選項以 assign_async 和 start_async

不建議使用

  • 不建議使用 phx-update="append" 和 phx-update="prepend"，建議改用 phx-update="stream"

0.20.1 (2023-10-09)

錯誤修正

  • 修正 auto_upload: true 時進行即時上傳的錯誤，發生在檔案無法預驗證時
  • 修正即時上傳的錯誤，在這個錯誤中，提早結束會導致地圖金鑰錯誤
  • 修正從用戶端重新連線時進行即時導覽時的匹配錯誤

增強功能

  • 支持 JavaScript 客户端上 File/Blob 子类的新 meta() 方法，让客户端在从 hook 中使用 upload/uploadTo 时传递任意元数据。%UploadEntry{} 的新 client_meta 字段填充自此信息。
  • 改善 void 标记和错误信息

0.20.0 (2023-09-22)

已棄用的項目

  • 棄用 ~L 特殊符號，採用 ~H
  • 在 LiveComponent 中棄用 preload/1，採用 update_many/1
  • 在 LiveComponent 中棄用 live_component/2-3，採用 <.live_component />
  • 棄用 live_patch，採用 <.link patch={...} />
  • 棄用 live_redirect，採用 <.link navigate={...} />
  • 棄用 live_title_tag，採用 <.live_title />

向後不相容的變更

  • 移除已棄用的 render_block/2，採用 render_slot/2
  • 移除已棄用的 live_img_preview/2，採用 <.live_img_preview />
  • 移除已棄用的 live_file_input/2，採用 <.live_file_input />

錯誤修復

  • 修正 auto_upload: true 的上傳在任何一個個別項目無效時，會無法傳播錯誤。
  • 修正 auto_upload: true 的上傳在任何一個個別項目無效時，會無法自動上傳合法的項目
  • 修正 auto_upload: true 的表單復原錯誤。
  • 修正表單復原的問題，即錯誤地選取隱藏輸入。
  • 修正 phx-change 為 JS 命令時的表單回復。
  • 修正串流重置問題，在嵌套 Live 函數元件包含嵌套串流時。
  • 修正連線錯誤時使用嵌套 LiveView，會將視窗位置重置為 null。
  • 修正 contenteditable 內的錨點會造成 LiveSocket 中斷連線。

強化功能

  • 透過 config :phoenix_live_view, debug_heex_annotations: true` 新增 heex 除錯標註，它會在已渲染的元件周圍套用特殊的 HTML 注釋，協助您辨識 HTML 文件中的標記，是在哪些函數元件樹中渲染的。
  • 新增 assign_async、start_async、<.async_result> 和 AsyncResult，以在 LiveView 或 LiveComponent 中宣告處理非同步操作。
  • 支持為 Phoenix.LiveView.send_update/3 傳遞 @myself
  • 在 Access.get 上支援變更追蹤
  • 允許覆寫 <.live_img_preview> 的 id

0.19.5 (2023-07-19)

向下不相容變更

  • 現在 Phoenix.LiveView.UploadWriter 的 close/1 回呼是 close/2，以 close 原因作為第二個引數傳遞。
  • 現在，Phoenix.LiveView.UploadWriter 的 write_chunk 回呼必須在發生錯誤時傳回更新的寫入器狀態。取代 {:error, reason}，應傳回 {:error, reason, new_state}。

改善

錯誤修正

  • 在 LiveView 結束或失去連線時呼叫 Phoenix.LiveView.UploadWriter 關閉回呼
  • 修正嵌在 :host 中的 JS.patch 到 Phoenix 路由範圍會導致錯誤
  • 修正patch 後的立即導覽不會更新 URL
  • 修正 live 元件內嵌套串流 child 會在嵌套串流內部重置串流

0.19.4 (2023-07-10)

改善

0.19.3 (2023-06-21)

錯誤修正

  • 修正元件更新內部 push_event 在某些情況下未送出的問題
  • 重新加入意外移除的 upload_errors/1

0.19.2 (2023-06-12)

錯誤修正

  • 修正使用 <input name="value" /> 時的問題

0.19.1 (2023-06-06)

改善

  • 允許 <.live_file_input> 上的 accept 屬性覆寫預設值

錯誤修正

  • 修正導致錨點點選中斷 LV 的問題，原因是其他腳本已透過 preventDefault() 處理

0.19.0 (2023-05-29)

向下不相容變更

  • 取消支援傳遞 id 給 phx-feedback-for 屬性。必須改而傳遞輸入名稱。
  • 移除先前已移除的 let 屬性。改用 :let
  • 移除先前已棄用的 <%= live_img_preview(entry) %>。改使用 <.live_img_preview entry={entry} />
  • 移除先前已棄用的 <%= live_file_input(upload) %>。改使用 <.live_file_input upload={upload} />
  • 移除先前已棄用的 <%= live_component(Component) %>。改使用 <.live_component module={Component} id=\"hello\" />
  • 渲染 HTML 屬性時，不要自動將底線轉換為破折號。改在適當情況下使用破折號或底線。

增強功能

  • 支援大宗插入作業的串流重設
  • 支援 inputs_for 中的順序輸入，以搭配 Ecto 的新式 sort_param 與 drop_param 轉換
  • 在表單事件中傳送表單的 phx-value

棄用事項

  • 停止傳遞 :dom_id 到 stream/4，改用 stream_configure/3
  • 停止使用 render_block/2，改用 render_slot/2
  • 停止使用 <%= live_img_preview(entry, opts) %>。改使用 <.live_img_preview entry={entry} {opts} />
  • 停止使用 <%= live_file_input(upload, opts) %>。改使用 <.live_file_input upload={upload} {opts} />
  • 停止使用無狀態的 LiveComponent，改用函式組件或 <.live_component id={...} /> (請注意，id 是必要的)

錯誤修正

  • 修正點擊 download 連結時 LiveView 會中斷
  • 修正嵌套的 for 理解中未傳送的串流刪除
  • 修正 mount 失敗時不會發動 phx-disconnected 約束
  • 支援只有隱藏式輸入（hidden input）的表單復原

0.18.18 (2023-03-16)

錯誤修正

  • 允許在組件中指定 :live_action
  • 在 assigns_to_attributes 中只篩選內部函式元件屬性
  • 只納入有名稱的提交者（submitter）

增強功能

  • 新增 JS.exec 指令，用於執行其他元素屬性中定義的指令

0.18.17 (2023-03-09)

錯誤修正

  • 修正如 handle_info 等的回呼在使用 Phoenix 程式碼重新載入進行程式碼變更後，在開發過程中會無法呼叫。

增強功能

  • 在表單送出事件中支援 submitter。
  • 在引用結構時避免 attr 的編譯時間依賴項
  • 驗證保留的指定。嘗試指定 :uploads、:streams、:live_action、:socket、:myself 現在會在 LiveView 和 LiveComponent 中提升

0.18.16 (2023-02-23)

增強功能

  • 支援 Live 元件中的串流
  • 在已連接的 LiveView 上觸發 Plug.Exception 時，最佳化外掛程式錯誤轉換

錯誤修正

  • 當有多個 HTML 註解時，修正格式設定器問題

0.18.15 (2023-02-16)

錯誤修正

  • 修正 JS.transition 應用錯誤的類別

增強功能

  • 在 type="reset" 輸入和按鈕上重設 phx-feedback-for 錯誤

0.18.14 (2023-02-14)

錯誤修正

  • 修正 LiveViewTest 找不到主控 Live 檢視

0.18.13 (2023-02-10)

增強功能

  • 改善在無法使用 Phoenix.Component 時發生的錯誤訊息

0.18.12 (2023-02-10)

增強功能

  • 介紹串流，以有效率地處理大型集合
  • 允許來自 :handle_event жизненный цикл掛鈎的回覆
  • 加入 <.inputs_for> 元件至 Phoenix.Component
  • 在 жизненный цикл :handle_event 掛鈎上支援回覆

錯誤修正

  • 修正重新指定已設定為預設值的屬性為相同預設值時的變更追蹤
  • 修正使用檔案選擇對話方塊後上傳拖放無法正常運作的問題
  • 修正表單的第一個輸入為 phx-change 時的表單復原

0.18.11 (2023-01-19)

錯誤修正

  • 修正預設防範的表單中 Socket 卸載連線

0.18.10 (2023-01-18)

錯誤修正

  • 修正包含 href 的 svg 標籤在按一下時錯誤地卸載 socket
  • 修正使用 target="_blank" 的表單提交在提交時錯誤地卸載 socket

0.18.9 (2023-01-17)

錯誤修正

  • 修正無法傳遞一般表單提交

0.18.8 (2023-01-16)

增強功能

  • 當前次導航是实时补丁时，返回时还原滚动位置

錯誤修正

  • 修正 Live 布局未套用到已連線的呈現

0.18.7 (2023-01-13)

錯誤修正

  • 修復在斷線渲染期間傳遞到 :live_session 時未套用即時版面配置
  • 修正外部錨點點擊與網址帶有雜湊值時不正確地卸載 socket

0.18.6 (2023-01-09)

錯誤修正

  • 修復外部點擊時會卸載外部錨點點擊

0.18.5 (2023-01-09)

錯誤修正

  • 修正外部錨點點擊會卸載 socket

0.18.4 (2023-01-05)

強化功能

  • 支援字串上傳名稱，以支援動態產生的 allow_upload

錯誤修正

  • 修正 LiveView 巢狀競爭條件因即時修補而導致巢狀子項在某些情況下跳過更新
  • 修正使用即時導覽時，瀏覽器紀錄顯示不正確標題，而帶有 @page_title
  • 修正使用 JS.push 進行表單變更時未定義的 _target 參數
  • 修正表單提交後新增的輸入項不見 phx-no-feedback
  • 修正導航或提交外部表單時，觸發 phx-disconnected 事件

0.18.3 (2022-10-26)

強化功能

  • 將 embed_templates 新增至 Phoenix.Component 以將範本檔嵌入為函數元件
  • 引發全域插槽屬性

錯誤修正

  • 當傳遞多個插槽條目且混用 if/for 語法時，修正插槽中的錯誤

0.18.2 (2022-10-04)

錯誤修正

  • 修正定義 :values 在 :default 之前時，匹配錯誤
  • 允許在外部重新導向中使用 PyTuple
  • 修正按 Enter 鍵時觸發點擊事件的競爭條件
  • 修正格式化工具中斷內嵌區塊，且周圍文字沒有空白時

強化功能

  • 新增 intersperse 元件，可以在列舉之間呈現分隔線

0.18.1 (2022-09-28)

錯誤修正

  • 修正 phx-loading 類別套用到已無效的檢視
  • 修正 <.live_img_preview /> 在上傳時造成無效屬性錯誤
  • 當元素已停用時，勿觸發 phx 事件

強化功能

  • 支援 :include 選項，以個別為基礎延伸全域屬性
  • 存取 ~H 之外的變數繫結時，顯示警告訊息

0.18.0 (2022-09-20)

LiveView v0.18 包含一個主要的全新功能，以宣告式指派的形式，提供新的 attr 和 slot API 來規範函式組件支援的屬性、類型和預設值。屬性和插槽會在編譯時期加以驗證，並發出警告 (需要 Elixir v1.14.0+)。

v0.18 包含許多新的函式組件，以取代其 EEx 表達式對應項 <%= ... %>。例如，live_redirect、live_patch 和 Phoenix.HTML 的 link 已被統一的 Phoenix.Component.link/1 函式組件取代。

<.link href="https://myapp.com">my app</.link>
<.link navigate={@path}>remount</.link>
<.link patch={@path}>patch</.link>

這些新的組件存在於 Phoenix.Component 模組中。 Phoenix.LiveView.Helpers 本身已被輕度捨棄，且所有相關功能都已遷移。你在升級時必須在先前匯入 Phoenix.LiveView.Helpers 的地方 import Phoenix.Component。你也可能需要在匯入 Phoenix.LiveView 並且將其部分函式移至 Phoenix.Component 的地方 import Phoenix.Component。

此外，函式組件上的特殊 let 屬性已由 :let 用法捨棄。

捨棄

  • live_redirect - 捨棄，改為使用 Phoenix.Component 的 <.link navigate={..}> 新組件。
  • live_patch - 捨棄，改為使用 Phoenix.Component 的 <.link patch={..}> 新組件。
  • push_redirect - 捨棄，改為使用 Phoenix.LiveView 上的 push_navigate 新函式。

加強

  • [組件] 透過 attr/slot 加入宣告式代碼指派，提供編譯時間驗證和警告。
  • [組件] 加入 :let 和 :for 新屬性，以及 :if，並支援 HTML 標籤、函式組件和插槽。我們仍支援 let，但格式化程式會將其轉換為 :let，且很快就會將其捨棄。
  • [組件] 加入 dynamic_tag 函式組件
  • [組件] 加入 link 函式組件
  • [組件] 加入 focus_wrap 函式組件，以對內容（如模式對話框和對話視窗）包裝焦點，以提供可存取性。
  • [記錄器] 加入新的 LiveView 記錄器，提供生命週期事件的遙測工具。
  • [JS] 加入新的 JS 指令 focus、focus_first、push_focus 和 pop_focus，以提供可存取性。
  • [Socket] 透過 use Phoenix.LiveView.Socket 支援分享 Phoenix.LiveView.Socket 與一般頻道
  • 新增 _live_referer 連結參數，以處理 push_navigate 轉址 URL
  • 新增 phx-connected 與 phx-disconnected binding，用於對生命週期變更做出反應
  • 新增未顯示檢視的支援給 JS 指令
  • 新增未顯示檢視的支援給掛勾

錯誤修正

  • 修復外部上傳問題，當外部在客戶端發生異常時，未清除監聽器
  • 不延遲 phx-blur

0.17.12 (2022-09-20)

增強功能

  • 新增對即將推出的 Phoenix 1.7 快閃介面的支援

0.17.11 (2022-07-11)

增強功能

  • 新增 replaceTransport 給 LiveSocket

錯誤修正

  • 取消延遲事件在經過一個 Live 導覽事件後發出指令
  • 修復雜湊錨點在 Live 導覽時無法捲動到錨點元素的問題
  • 不延遲 phx-blur 事件

0.17.10 (2022-05-25)

錯誤修正

  • [格式化器] 保留屬性的單引號分隔器
  • [格式化器] 不格式化未包含空白字元的內嵌元素
  • [格式化器] 無空白字元時保留文字和 eex
  • [格式化器] 修復 EEX 運算式後的換行
  • [格式化器] 將自關閉標籤處理為內嵌元素
  • [格式化器] 不格式化內嵌元素之間未包含空白字元
  • [格式化器] 屬性 contenteditable 存在時不進行格式化

增強功能

  • [格式化器] 引入特殊屬性 phx-no-format 以略過格式化

0.17.9 (2022-04-07)

錯誤修正

  • 修復 LiveViews 導覽時無法修補問題
  • 不觸發動態 phx-update 值

0.17.8 (2022-04-06)

增強功能

  • 新增 HEEx 格式化器
  • 支援個別輸入中的 phx-change
  • 在客戶端發布 MouseEvent
  • 在 JS.dispatch 中新增 :bubbles 選項，以控制事件冒泡
  • 在掛勾上公開底層 liveSocket 實例
  • 預設在 localhost 上啟用客戶端除錯

錯誤修正

  • 修復 mount 進行兩次 Live 重導時所導致的掛勾和 sticky LiveView 問題
  • 修復某些情況下 phx-remove 的子元素未呼叫已毀損的鉤子
  • 若在推播逾時時已中斷連線，不會安全重新載入頁面
  • 不會將導覽按一下事件傳送至常規的 phx-click
  • 不再為沒有動作的表單產生 csrf_token，以減少 phx-change/phx-submit 事件期間的負載

0.17.7 (2022-02-07)

強化功能

  • 最佳化巢狀 For 推論差異

錯誤修正

  • 修復在某些情況下未連線時按一下 live_redirect 連結時的錯誤

0.17.6 (2022-01-18)

強化功能

  • 新增 JS.set_attribute 和 JS.remove_attribute
  • 新增 live_render 的 sticky: true 選項，以在即時重新導向期間維護巢狀子元素
  • 在 JS.show|hide|toggle 時分派 phx:show-start、phx:show-end、phx:hide-start 和 phx:hide-end
  • 新增 get_connect_info/2，它也可以在中斷連線的呈現時運作
  • 新增 LiveSocket 建構函數選項，可透過新的 maxReloads、reloadJitterMin、reloadJitterMax、failsafeJitter 選項來設定安全失效行為

錯誤修正

  • 即使伺服器上沒有任何變更，也會在提交後顯示表單錯誤
  • 修復 phx-disable-with 無法停用表單外的元素
  • 修復針對外部 LiveView 時，phx 參考追蹤會讓元素處於等待狀態
  • 修復在某些情況下，回應的差異未等待主動轉場
  • 修復 phx-click-away 未遵守 phx-target
  • 修復「中斷連線」廣播無法安全重新整理頁面
  • 修復在某些情況下設定 :target 的 JS.push 無法傳送至正確組件

不推薦使用

0.17.5 (2021-11-02)

錯誤修正

  • 如果元素不可見，勿觸發 phx-click-away
  • 修正 phx-remove 無法分解嵌套的動態子元素

0.17.4 (2021-11-01)

錯誤修正

  • 修正變數作用域問題，導致各種內容區塊或重複渲染錯誤

0.17.3 (2021-10-28)

功能強化

  • 支援 JS class 動畫的 3 元組，以支援階段式動畫，其中過渡類別套用在開始和結束類別上
  • 允許在 LiveView 容器外的 DOM 節點上執行 JS 指令

最佳化

  • 避免理解中的重複靜態。在之前的版本中，理解僅能避免其根元素內容中的重複。現在我們會遞迴地遍歷所有理解節點，並僅針對整個理解傳送一次靜態。這應大幅降低透過網路傳送理解的成本

錯誤修正

  • 修正 HTML 引擎錯誤，導致重複表達式或無法正確渲染
  • 修正 HTML 引擎錯誤，導致槽位沒有在應重新渲染時重新渲染
  • 修正表單回復傳送到錯誤目標

0.17.2 (2021-10-22)

錯誤修正

  • 修正 HTML 引擎錯誤，導致屬性表達式在某些情況下錯誤評估
  • 修正無法回復自訂顯示的 show/hide/toggle
  • 修正 JS.show|hide|dispatch 的預設 to 目標
  • 修正表單輸入目標

0.17.1 (2021-10-21)

錯誤修正

  • 修正 phx 繫結互動的 SVG 元素支援

0.17.0 (2021-10-21)

重大變更

on_mount 變更

LiveView 0.16 中引入的 hook API 已根據回饋進行改善。LiveView 0.17 移除了 Phoenix.LiveView.on_mount/1 巨集和 Phoenix.LiveView.Router.live_session/3 的 :on_mount 選項的自訂模組函數回呼，以支援自訂引數。為清楚起見，在掛載生命週期階段中呼叫的模組函數將永遠命名為 on_mount/4。

例如，如果你這樣呼叫 on_mount/1

on_mount MyAppWeb.MyHook
on_mount {MyAppWeb.MyHook, :assign_current_user}

並將你的回呼定義為

# my_hook.ex

def mount(_params, _session, _socket) do
end

def assign_current_user(_params, _session, _socket) do
end

將回呼變更為

# my_hook.ex

def on_mount(:default, _params, _session, _socket) do
end

def on_mount(:assign_current_user, _params, _session, _socket) do
end

只提供模組名稱時，on_mount/4 的第一個引數將會是原子 :default。

狀態化 LiveComponents 中的 LEEx 範本

現在，有狀態的 LiveComponents（提供 :id）必須傳回 HEEx 範本（~H 標識或 .heex 副檔名）。不再支援 LEEx 範本（~L 標識或 .leex 副檔名）。這能解決錯誤，並允許在客戶端側更有效率地呈現有狀態的元件。

phx-disconnected 類別已由 phx-loading 取代

由於最新發布的 Safari 15 中存在錯誤，以前使用的 .phx-disconnected 類別已由新的 .phx-loading 類別取代。變更原因是 phx.new 在產生的 app.css 中包含 .phx-disconnected 規則，而這會觸發 Safari 錯誤。重新命名類別可避免對現有應用程式套用錯誤的規則。使用者可以透過將 .phx-disconnected 規則重新命名為 .phx-loading 來升級。

phx-capture-click 已不建議使用，建議使用 phx-click-away

新的 phx-click-away 繫結取代了 phx-capture-click，而且功能更強大，因為它可以偵測容器的「按一下焦點」遺失。

移除先前不建議使用的功能

已移除一些先前不建議使用功能

  • 不再支援 live_component do-區塊中的隱式指定
  • 如果可以，現在傳遞 @socket 給 live_component 會提出問題

擴充

  • 允許在函式元件中使用插槽：它們標記為 <:slot_name>，並可透過 <%= render_slot @slot_name %> 呈現
  • 新增 JS 指令，以在客戶端透過擴充的 push API 執行 JavaScript 公用程式作業
  • 最佳化字串屬性
    • 如果屬性是字串內插，例如 <div class={"foo bar #{@baz}"}>，只會將內插的部分標記為動態
    • 如果屬性可以是空的，例如「類別」和「樣式」，請將屬性名稱保持為靜態
  • 新增一個函式元件，用於呈現 Phoenix.LiveComponent。取代 <%= live_component FormComponent, id: "form" %>，現在您必須這樣做：<.live_component module={FormComponent} id="form" />

錯誤修正

  • 修正 LiveViews，其中表單復原在重新連線後無法正確掛載，而在此之前會進行即時重新導向
  • 修正過期的階段會導致從掛載發出 push_redirect 時，完全重新導向故障回退
  • 新增解除 Safari 錯誤的方法，造成含有 srcset 的 <img> 標籤與自動播放的影片無法顯示
  • 支援在 HEEx 範本的 HTML 註解中進行 EEx 內插
  • 支援在 script 標籤裡放置 HTML 標籤 (如同一般 HTML)
  • 在屬性名稱中使用引號時引發錯誤
  • 當無法分析內插屬性時，在錯誤訊息中包含檔案名稱
  • 確保測試用的用戶端總是在 live_patch/live_redirect 上發送完整的 URL。這會鏡像 JavaScript 用戶端的執行行為
  • 在 live_redirect 上不要從 session 中重新載入 flash
  • 當在 focus 期間修補 DOM 時，修正 Chrome 中選取下拉選單閃爍的錯誤

已棄用元件

  • <%= live_component MyModule, id: @user.id, user: @user %> 已棄用，建議改用 <.live_component module={MyModule} id={@user.id} user={@user} />。請注意新的 API 要求使用 HEEx 範本。這項變更允許我們進一步改善 LiveComponent 並為它們帶來更多功能，例如區塊
  • 已棄用 render_block/2，建議改用 render_slot/2

0.16.4 (2021-09-22)

增強功能

  • 改善 HEEx 錯誤訊息
  • 放寬 HTML 標籤驗證，以支援大小寫混合的標籤
  • 支援自行封閉的 HTML 標籤
  • 移除 handle_params 在生命週期掛鉤中已定義的要求

錯誤修正

  • 修正讓 pushes 無法在訊息上納入頻道 join_ref 的錯誤

0.16.3 (2021-09-03)

錯誤修正

  • 修正 on_mount 掛鉤會在掛鉤發出暫停重導向時，在重導向之前呼叫檢視 mount

0.16.2 (2021-09-03)

增強功能

  • 改善產生詞幹時的錯誤訊息
  • 改善缺少 @inner_block 時的錯誤訊息

錯誤修正

  • 修正當元件順序變更時，讓 phx-change 表單復原事件錯誤地傳送至錯誤元件的錯誤

0.16.1 (2021-08-26)

增強功能

錯誤修正

  • 不會為非 POST 表單產生 CSRF 權杖
  • 不會在 compile 時對 on_mount 宣告增加相依性

0.16.0 (2021-08-10)

從 0.15 升級的安全性考量

LiveView v0.16 透過支援純粹在既有 WebSocket 連線上的瀏覽，進而最佳化動態重新導向。此功能是透過 Phoenix.LiveView.Router 的新 live_session/3 功能所達成。安全性指南 一直強調以下內容

... 如我們所見，LiveView 以標準 HTTP 請求開始生命週期。隨後建立一個有狀態連線。HTTP 請求和有狀態連線透過參數和階段接收用戶端資料。這表示任何階段驗證都必須同時在 HTTP 請求（外掛管線）及有狀態連線（LiveView 掛載）中進行 ...

這些指引仍然適用，但現在必須在 LiveView 掛載生命週期內強制執行驗證及階段驗證，因為來自用戶端的 live_redirect 將不會像硬重整或初始 HTTP 呈現一樣通過外掛管線。這表示在 Plug.Conn 管線中執行的驗證、授權等，也必須在 LiveView 掛載生命週期內執行。

動態階段可讓您支援共用安全性模型，讓 live_redirect 只能在同一個動態階段名稱底下定義的路由之間發出。如果用戶端嘗試對不同的動態階段執行動態重新導向，該要求會被拒絕，而優雅的用戶端端重新導向會觸發一個對嘗試 URL 的標準 HTTP 請求。

請參閱 Phoenix.LiveView.Router.live_session/3 文件，取得更多資訊和範例使用方式。

新的 HTML 引擎

LiveView v0.16 引入了 HEEx（HTML + EEx）範本，以及透過 Phoenix.Component 提供函式元件的概念。新的 HEEx 範本在範本中驗證標記，同時提供更智慧的變更追蹤，以及語法便利性，讓建立可組合元件更加容易。

函式元件是接收分配清單，並傳回 ~H 範本的任何函式

defmodule MyComponent do
  use Phoenix.Component

  def btn(assigns) do
    ~H"""
    <button class="btn"><%= @text %></button>
    """
  end
end

現在可以在 HEEx 範本中使用此元件，如下所示

<MyComponent.btn text="Save">

HEEx 和函式元件的加入帶來了一系列不建議使用的警告，其中有些是在此版本中提出，其他的則會在未來加入。請注意，HEEx 範本需要 Elixir v1.12+。

升級和不再建議使用

本次發布的主要棄用項目為 ~L 標誌和 .leex 延伸模組現在已遭軟棄用。文件已更新，建議避免使用這些項目，未來版本將發出警告。建議在應用程式的未來範本中改用 ~H 標誌和 .heex 延伸模組。同時，你還應根據下列建議，調整原有的範本。

從 LEEx 遷移到 HEEx 的過程相對容易。主要有兩項不同。首先，HEEx 不允許在標籤內內插。因此，請不要使用

<div id="<%= @id %>">
  ...
</div>

應該改用 HEEx 語法

<div id={@id}>
  ...
</div>

另一項不同在於 form_for。有些範本可能會執行下列動作

~L"""
<%= f = form_for @changeset, "#" %>
  <%= input f, :foo %>
</form>
"""

但轉換成 ~H 後，它並非有效的 HTML：</form> 標籤存在，但其開啟隱藏在 Elixir 程式碼中。在 LiveView v0.16 中，有一個名為 form 的函數元件

~H"""
<.form :let={f} for={@changeset}>
  <%= input f, :foo %>
</.form>
"""

我們了解將所有範本從 ~L 遷移到 ~H 可能是一項艱巨的任務。因此，我們計畫在 LiveView 中長期支援 ~L。但我們無法對狀態導向 LiveComponent 執行相同的動作，因為一些重要的用戶端功能和最佳化會倚賴 ~H 標誌。因此**我們建議先在 live 元件（尤其是狀態導向 live 元件）中置換 ~L 以 ~H**。

此外，無狀態 live_component（亦即沒有 :id 的 live 元件）將遭到棄用，取而代之的是新的函數元件。我們計畫在合理的一段期間內支援這些項目，但你應避免在應用程式中建立新的元件。

重大變更

LiveView 0.16 從 Phoenix.LiveView.Routing.live/4 中移除 :layout 和 :container 選項，改在 Phoenix.Router.live_session/3 中使用 :root_layout 和 :container 選項。

例如，如果你在 LiveView 0.15 及之前版本中使用下列程式碼

live "/path", MyAppWeb.PageLive, layout: {MyAppWeb.LayoutView, "custom_layout.html"}

請改成

live_session :session_name, root_layout: {MyAppWeb.LayoutView, "custom_layout.html"} do
  live "/path", MyAppWeb.PageLive
end

在用戶端，phoenix_live_view 套件不再為 LiveSocket 提供預設匯出。

如果你在 JavaScript 入口點（通常位於 assets/js/app.js）中使用下列程式碼

import LiveSocket from "phoenix_live_view"

請改成

import { LiveSocket } from "phoenix_live_view"

此外，在用戶端中，根部 LiveView 元素不再公開 LiveView 模組名稱，因此 phx-view 屬性永遠不會設定。類似地，已移除用戶端勾子新增功能的 viewName 屬性。

呼叫自訂函數 component/3 的程式庫應重新命名該函數或指定其模組以避免衝突，因為 LiveView 導入了具有該名稱的巨集，而該巨集由底層引擎特別處理。

功能強化

  • 新增 HEEx 範本
  • 新增 Phoenix.Component
  • 新增 Phoenix.Router.live_session/3 以最佳化動態重新導向
  • 新增 on_mount 和 attach_hook 掛鉤，提供一種機制可運用於 LiveView 生命週期的關鍵階段
  • 新增上傳方法至用戶端掛鉤
  • [輔助工具] 最佳化 live_img_preview 呈現
  • [輔助工具] 新增 form 函式元件，包裝 Phoenix.HTML.form_for
  • [LiveViewTest] 新增 with_target 以直接定義元件範圍
  • [LiveViewTest] 新增 refute_redirected
  • [LiveViewTest] 支援多個 phx-target 值以反映 JS 用戶端
  • [LiveViewTest] 新增 follow_trigger_action
  • [JavaScript 用戶端] 新增 sessionStorage 選項 LiveSocket 建構函數，以支援用戶端儲存空間覆寫
  • [JavaScript 用戶端] 當分頁無法連線且分頁不可視時，不會在背景中執行防呆重新載入頁面

錯誤修正

  • 確保在 render_component 中載入元件，以確保呼叫所有相關的回呼
  • 修正 Phoenix.LiveViewTest.page_title 在某些情況下回傳 nil
  • 修正按鈕在伺服器上明確設定為已停用時重新啟用
  • 修正動態修補無法在同一回呼生命週期內透過 handle_params 再次修補時更新網址
  • 修正當頁面動態修補時未套用 phx-no-feedback 類別
  • 修正針對非標準 ID 執行 DOM 查詢時 DOMException, querySelector, not a valid selector
  • 修正 Chrome/macOS 上在指定變數時選取下拉式選單快速關閉/開啟
  • 修正單一表格中有多個 live_file_input 時的競爭條件
  • 修正 showError 導致 null querySelector 的競爭條件
  • 修正靜態資料在遞迴差異中無法正確解析
  • 修正 Phoenix.LiveView.Diff.many_to_iodata 中沒有函式子句比對
  • 修正透過元件上傳檔案後上傳輸入未清除
  • 修正重新連線時上傳導致頻道崩潰
  • 修正為大型上傳傳送重複的進度事件

非建議事項

  • 將 do-end 區塊傳遞至 live_component 時的明確指定變數已過時
  • 已建議棄用 ~L 符號和 .leex 副檔名，建議使用 ~H 和 .heex 取而代之
  • 建議棄用無狀態動態元件（不含 :id 的 live_component 呼叫），建議使用新的函式元件功能

0.15.7 (2021-05-24)

修正錯誤

  • 修正產生缺少 morphdom 相依性而導致 webpack 建置中斷的問題

0.15.6 (2021-05-24)

修正錯誤

  • 修正從 handle_params 再次修正動態載入連結時，動態載入無法更新網址的問題
  • 修正使用頻道上傳和進度回呼時，LiveViewTest.render_upload/3 的回歸問題
  • 修正移除時上傳的元件沒有被清除的問題
  • 修正當上傳工作尚未結束就重新連線 LiveView 時出現的 KeyError 問題

功能提升

  • 透過 component/3 支援函式元件
  • 優化進度事件，降低大型檔案傳輸時傳送的封包數量
  • 允許覆寫會話和本機儲存空間的用戶端

棄用事項

  • 棄用 live_component/3 呼叫中的 @socket/socket 參數

0.15.5 (2021-04-20)

功能提升

  • 新增 upload_errors/1 用於傳回頂層上傳錯誤

修正錯誤

  • 修正 consume_uploaded_entry/3 使用外部上傳導致狀態不一致的問題
  • 修正 push_event 在單一差異從不同元件產生多個事件時遺失事件的問題
  • 修正元件樹共享深度合併的問題

0.15.4 (2021-01-26)

修正錯誤

  • 修正嵌套的 live_render 導致子 LiveView 重新安裝，即使 ID 沒有變更也一樣的問題
  • 在未連線的情況下不要嘗試推送掛勾事件
  • 修正優先執行的參照導致 auto_upload: true 無法提交表單的問題
  • 在 max_entries 為 1 時取代單一上傳項目，而非累積多個檔案選取
  • 修正 open_browser 中的 static_path 無法載入樣式表的問題

0.15.3 (2021-01-02)

修正錯誤

  • 修正 push_redirect 回傳導致用戶端逾時的問題

0.15.2 (2021-01-01)

向下不相容的變更

  • 移除 phx-hook 回呼中的 beforeDestroy

修正錯誤

  • 修正表單復原在第一次連線失敗時無法傳送輸入資料的問題
  • 修正 LiveView 重新連線後未重新掛載掛勾
  • 修正掛勾 reconnected 回呼在未先中斷的情況下觸發

0.15.1 (2020-12-20)

功能強化

  • 確保所有點擊事件會在行動版 Safari 上浮動
  • 在 LiveView 呼叫程序中執行 consume_uploaded_entries

錯誤修正

  • 修正 LiveView 回復後未重新掛載掛勾
  • 修正錯誤導致由先前關閉的通道發出逾時而造成重新載入延遲
  • 修正元件子節點在元件修補程式從單一根節點變為多個子同儕時遺失
  • 修正 phx-capture-click 在文字選取期間於滑鼠彈起時觸發
  • 修正 LiveView push_event 未在元件中清除
  • 修正 <textarea> 在獲得焦點情況下會被 LiveView 修補

0.15.0 (2020-11-20)

功能強化

  • 新增檔案上傳進度、互動式檔案選取和直接雲端支援等動態上傳支援
  • 實作 Phoenix.LiveViewTest.open_browser/2，可開啟瀏覽器瀏覽 LiveView 頁面

向後不相容的變更

  • 移除元件中的 @inner_content，並加入 render_block 以用於呈現元件 @inner_block
  • 移除 Socket 範本中的 @live_module，改用 @socket.view

錯誤修正

  • 確保 URL 在分離後已解碼
  • 不要復原沒有輸入項的表單
  • 修正元件移除後立即重新新增，但客戶端仍無法通知其 CIDs 已被銷毀的競合情況
  • 如果僅將事件/回覆新增到 Socket，請勿呈現 LiveView
  • 在初始呈現期間分享元件子樹時，適當合併不同的元件
  • 允許 do-blocks 內部變數受到汙染
  • 修正 push_redirect 從掛載擱置於客戶端，並在跟隨客戶端上已點擊 live_redirect 時導致回退到重新載入整個頁面

0.14.8 (2020-10-30)

錯誤修正

  • 修正與最新 Plug 的相容性

0.14.7 (2020-09-25)

錯誤修正

  • 修正從事件傳回 redirect(socket, external: ...) 時的錯誤
  • 在動態修補程式/重新導向時適當地遵循位置雜湊
  • 修復 Phoenix.LiveViewTest 中 phx-update 節點具有非 HTML 節點作為子節點時的失敗
  • 修復 phx_trigger_action 在 DOM 更新完成之前提交表單

0.14.6 (2020-09-21)

錯誤修正

  • 修復 phx-trigger-action 上的競爭狀態，導致伺服器表單提交前重新連線

0.14.5 (2020-09-20)

增強功能

錯誤修正

  • 修復使用 live_redirect 且後退/前進時捲軸位置
  • 產生相異時處理遞迴元件
  • 支援Mount時的硬重新導向
  • 在 Phoenix.LiveViewTest 上刪除時適當地追蹤巢狀元件

0.14.4 (2020-07-30)

錯誤修正

  • 修復隱藏輸入項目引發選取範圍錯誤

0.14.3 (2020-07-24)

增強功能

  • 支援使用 LiveEEx 的 render_layout

錯誤修正

  • 修復延遲修正會覆寫焦點輸入項
  • 修復 "_target" 輸入名稱包含陣列時 LiveView 的錯誤
  • 將 do-block 傳遞給元件時修復變更追蹤

0.14.2 (2020-07-21)

錯誤修正

  • 修復分配的地圖與 @inner_content 會導致 no function clause matching in Keyword.put/3 錯誤
  • 修復 LiveViewTest 無法正確地修改基於 append/prepend 的 phx-update 的子項
  • 提供 :as 選項給 live 路線時修復引數錯誤
  • 修復伺服器在處理即時修正時崩潰時網頁沒有回應
  • 修復空的相異導致懸而未決的基於資料參考的更新（例如類別和 phx-disable-with）未更新
  • 修復限制 keydown 事件會浪費按鍵輸入的錯誤
  • 修復提交表單時無法停用 <textarea>
  • 使用 phx-update append/prepend 修復文字節點 DOM 記憶體外洩

增強功能

  • 允許將 :router 傳遞給 render_component
  • 在編譯警告的 ~L 中顯示檔案
  • 在使用不帶 DOM ID 的鉤子時，在客戶端記錄錯誤
  • 根據 DOM 更新優化 phx-update 附加/前置

0.14.1 (2020-07-09)

修正錯誤

  • 修復在某些情況下從 DOM 中移除時，嵌套 live_render 無法中斷
  • 修復嵌套條件無法重新評估的 LEEx 問題

0.14.0 (2020-07-07)

修正錯誤

  • 修復 IE11 問題，其中 document.activeElement 會建立一個空值參考
  • 修復在明確呼叫 liveSocket.disconnect() 後緊接著呼叫 liveSocket.connect() 時，根視圖的設定和中斷
  • 修復 error_tag 無法顯示於非文字類型的輸入，例如下拉式選單和核取方塊，因為總是套用phx-no-feedback類別
  • 修復應用於 live_redirect 的 phx-error 類別
  • 正確處理 Elixir 的特殊變數，例如 __MODULE__
  • 在修補程式期間不再設定中斷的類別
  • 追蹤快閃快鍵以修復相繼的快閃訊息被捨棄的問題
  • 在伺服器上已移除組件的情況下，正確處理客戶端的空組件差異
  • 確保嵌套即時視圖中的組件不衝突
  • 修復未從客戶端傳送 phx-static 給子視圖
  • 嘗試刪除已刪除的視圖時，不會失敗
  • 確保在移除元素的子項中的鉤子中，呼叫 beforeDestroy

增強功能

  • 當組件已經存在於客戶端時，允許共享整個組件靜態子樹
  • 新增遠測事件至 mount、handle_params 和 handle_event
  • 新增 push_event 以將事件和資料從伺服器推送到客戶端
  • 新增客戶端 handleEvent 鉤子方法，以接收從伺服器推送的事件
  • 新增功能，可透過 {:reply, map, socket} 從伺服器接收對 pushEvent 的回覆
  • 使用事件監聽器來監聽 popstate，以避免與使用者定義的 popstate 處理常式衝突
  • 在未包含直接 DOM 子項的情況下呈現組件時，在客戶端記錄錯誤
  • 使 assigns.myself 成為結構，以捕捉錯誤
  • 如果組件在 send_update 中不存在，則記錄，如果模組不可用，則引發

0.13.3 (2020-06-04)

修正錯誤

  • 修復在使用計時去抖動的情況下，因失去焦點而觸發重複的去抖動事件
  • 修復 live_redirect 路由導致伺服器上重新導向至非即時路由時發生的客戶端錯誤
  • 修復無根元件更新時移除 DOM 手足元件
  • 修復經由 Tab、Meta 或其他不可列印鍵而模糊化的去抖動式輸入，導致無法傳送最後變更的錯誤

增強功能

  • 將 dom 選項新增至 LiveSocket，並將 onBeforeElUpdated 回呼用於外部用戶端程式庫支援廣泛的 DOM 操作

0.13.2 (2020-05-27)

錯誤修正

  • 修正以元件交換根範本會導致 LiveView 當機的錯誤

0.13.1 (2020-05-26)

錯誤修正

  • 修正來自 live_redirect 的 push_redirect 會強制頁面重新整理

增強功能

  • 最佳化元件差異，避免傳送空值差異
  • 最佳化元件以分享靜態值
  • [LiveViewTest] 自動同步化渲染事件之前

0.13.0 (2020-05-21)

向後不相容變更

  • 不再預設傳送事件中繼資料。中繼資料現為選用，且由使用者在 LiveSocket 層級定義。為維持與 0.13 版本之前的行為向後相容，你可以提供下列中繼資料選項
  let liveSocket = new LiveSocket("/live", Socket, {
    params: {_csrf_token: csrfToken},
    metadata: {
      click: (e, el) => {
        return {
          altKey: e.altKey,
          shiftKey: e.shiftKey,
          ctrlKey: e.ctrlKey,
          metaKey: e.metaKey,
          x: e.x || e.clientX,
          y: e.y || e.clientY,
          pageX: e.pageX,
          pageY: e.pageY,
          screenX: e.screenX,
          screenY: e.screenY,
          offsetX: e.offsetX,
          offsetY: e.offsetY,
          detail: e.detail || 1,
        }
      },
      keydown: (e, el) => {
        return {
          altGraphKey: e.altGraphKey,
          altKey: e.altKey,
          code: e.code,
          ctrlKey: e.ctrlKey,
          key: e.key,
          keyIdentifier: e.keyIdentifier,
          keyLocation: e.keyLocation,
          location: e.location,
          metaKey: e.metaKey,
          repeat: e.repeat,
          shiftKey: e.shiftKey
        }
      }
    }
  })

錯誤修正

  • 修正 Chrome 在原生 UI 自動完成時傳送 keydown 事件，但沒有傳送 key 的錯誤
  • 修正 live 導覽要求發出重新導向時發生的伺服器錯誤
  • 修正明確呼叫 LiveSocket connect/disconnect/connect 時發生的重複視窗繫結

增強功能

  • 新增 Phoenix.LiveView.get_connect_info/1
  • 新增 Phoenix.LiveViewTest.put_connect_info/2 與 Phoenix.LiveViewTest.put_connect_params/2
  • 新增支援在冷伺服器配置期間追蹤頁面上靜態資產變動
  • 新增支援將 @myself 目標傳遞給 Hook 的 pushEventTo 目標
  • 使用新的 metadata LiveSocket 選項，新增可設定事件中繼資料
  • 新增連線參數中 "_mounts" 鍵，用於指定 LiveView 已 mount 的次數

0.12.1 (2020-04-19)

錯誤修正

  • 修正元件 innerHTML 在元件上方出現手足 DOM 元素時會被拋棄，且元件沒有 DOM ID 的錯誤
  • 修正 Firefox 在硬式轉址中短暫重新連線
  • 修正當伺服器返回空檔位元時，phx-disable-with 和其他待定屬性沒有被還原的問題
  • 確保 LiveView 模組在 mount 之前載入，以防止對連線的 LiveView 進行的第一次應用程式請求記錄錯誤

0.12.0 (2020-04-16)

這個版本的 LiveView 對測試模組進行全面改造，將 LiveView 範本與 LiveView 事件更緊密地整合在一起。例如，在以前版本中，你可以撰寫這項測試

  render_click(live_view, "increment_by", %{by: 1})

然而，無法保證頁面上有任何元素具備 phx-click="increment" 屬性和將 phx-value-by 設為 1。有了 LiveView 0.12.0，現在你可以寫

  live_view
  |> element("#term .buttons a", "Increment")
  |> render_click()

新的實作將檢查 #term .buttons a 中有沒有按鈕，內容為「增加」，驗證它是否具有 phx-click 屬性並自動向它提交所有相關的 phx-value 項目。這讓我們更接近整合/驗收測試框架，而且不用執行無頭瀏覽器的負擔和複雜性。

強化功能

  • 新增 assert_patch/3 和 assert_patched/2 來確認補丁檔
  • 新增 follow_redirect/3 以自動追蹤來自 render_* 事件的重新導向
  • 新增表格註釋 phx-trigger-action，以在下一個 DOM 補丁中觸發 HTTP 表單提交

修正錯誤

  • 修正 phx-target @myself 設定具有相同元件 ID 的兄弟元件 LiveView 為目標
  • 修正 phx:page-loading-stop 在執行 DOM 補丁之前觸發
  • 修正 phx-update="prepend" 在連續更新相同 ID 時無法正確補丁 DOM
  • 修正 mount 時的重新導向無法複製閃存

向下不相容變更

  • phx-error-for 已移除，改用 phx-feedback-for。每當必須隱藏回饋資料時，phx-feedback-for 都會設定一個 phx-no-feedback 類別

  • Phoenix.LiveViewTest.children/1 已重新命名為 Phoenix.LiveViewTest.live_children/1

  • Phoenix.LiveViewTest.find_child/2 已重新命名為 Phoenix.LiveViewTest.find_live_child/2

  • Phoenix.LiveViewTest.assert_redirect/3 不再比對閃存，而是回傳閃存

  • Phoenix.LiveViewTest.assert_redirect/3 不再與修補程式重新導向相符，請改用 assert_patch/3

  • Phoenix.LiveViewTest.assert_remove/3 已被移除。如果 LiveView 發生崩潰，也會導致測試發生崩潰

  • 傳遞包含 DOM ID 的路徑給 render_* 測試函式已不再建議使用。此外，現在它們需要在給定的 DOM ID 上具備 phx-target="<%= @id %>"

    <div id="component-id" phx-target="component-id">
  ...
</div>
    html = render_submit([view, "#component-id"], event, value)

    在任何情況下，此 API 已不建議使用，您應遷移至新的基於元素的 API。

0.11.1 (2020-04-08)

錯誤修正

  • 修正空差分後無法復原為唯讀狀態
  • 修正動態新增的子代無法被用戶端加入
  • 修正重連時導致已過期客戶端會話嘗試重新加入的錯誤崩解
  • 修正重新加入期間重複的預插入/附加內容
  • 追蹤 LiveEEx 引擎中的 unless

向下不相容的變更

  • render_event/render_click 及其同類型函式現在預期給予 DOM ID 選擇器以在與元件協作時使用。例如，請勿使用 render_click([live, "user-13"])，而應改寫為 render_click([live, "#user-13"])，以反映 phx-target API。
  • 存取 Socket 並直接將指定賦值 @socket.assigns[...] 到範本中現在會引發例外狀況 Phoenix.LiveView.Socket.AssignsNotInSocket。Socket 指定賦值會直接以 LiveEEx assigns 的形式在範本內使用，例如 @foo 和 @bar。應透過範本中的 assigns 來完成任何指定賦值存取，而 Tracking 會在那裡進行適當的變更。

提升

  • 在輸入模糊時立即觸發延遲執行事件
  • 支援 LiveSocket 建構函數上的 defaults 選項，用以設定預設 phx-debounce 和 phx-throttle 值，允許使用 <input ... phx-debounce>
  • 將 detail 金鑰新增到點擊事件中繼資料，用於偵測兩次/三次點擊

0.11.0 (2020-04-06)

向下不相容的變更

  • 在呈現期間移除 socket.assigns，以避免變更追蹤錯誤。如果您先前仰賴傳遞 @socket 給函式然後參照 Socket 指定賦值，請從範本中傳遞明確的指定賦值給您的函式。

  • 已移除 assets/css/live_view.css。如果您想顯示進度條，請在 app.css 中替換

    - @import "../../../../deps/phoenix_live_view/assets/css/live_view.css";
+ @import "../node_modules/nprogress/nprogress.css";

    並在新功能中加入 nprogress 至 assets/package.json。詳細資訊請見 進度動畫

錯誤修正

  • 修正 LiveView 超過二層嵌套的客戶端問題
  • 修正僅變更元件，卻會使整個 LiveView 重新渲染的錯誤
  • 修正重新加入時不會觸發 phx:page-loading-stop 問題

加強功能

  • 支援深度變更追蹤，因此 @foo.bar 僅在 bar 變更後執行並進行差異處理
  • 加入 @myself 給予，允許元件目標為自己，而非依賴 DOM ID，例如：phx-target="<%= @myself %>"
  • 最佳化多種客戶端渲染場景，以利元件更快速的 DOM 修補和附加/前置內容
  • 在 LiveSocket 中加入 enableProfiling() 和 disableProfiling()，用於客戶端效能設定檔，以協助開發程序
  • 允許 LiveView 在 LiveComponent 中渲染
  • 支援在元件中清除快閃訊息

0.10.0 (2020-03-18)

向下不相容變更

  • 將 socket 給予 @live_view_module 重命名為 @live_module
  • 將 socket 給予 @live_view_action 重命名為 @live_action
  • LiveView 不再使用預設應用程式配置，也不再支援 put_live_layout。請改用 put_root_layout。不過請注意，提供給 put_root_layout 的配置必須使用 @inner_content，而非 <%= render(@view_module, @view_template, assigns) %>，而且根配置也會由一般檢視使用。請查看文件中的 Live 配置 區段。

錯誤修正

  • 修正載入狀態，導致在執行即時導覽時，嵌套的 LiveView 會被移除
  • 僅在資料屬性已變更時才會觸發 phx-update="ignore" hook
  • 修正 LiveEEx 指紋錯誤，導致在某些情況下不會傳送差異

加強功能

  • 支援共置範本，其中與 LiveView 相同基本檔名的 .html.leex 範本會自動用於 render/1
  • 加入 live_title_tag/2 helper，用於自動在 @page_title 更新中增加前置字元/後置字元

0.9.0 (2020-03-08)

錯誤修正

  • 未將被忽略的輸入欄位和按鈕設定為唯讀
  • 僅在 URI 中解碼路徑
  • 取代主體時，僅銷毀主體的後代
  • 修復兄弟元件補丁，當兄弟元件位在相同的根 DOM 樹時
  • 不要挑選來自 :use 的配置，在子 LiveView 上
  • 當配置設定為 false 在路由器和 mount 上，請尊重
  • 修復兄弟元件補丁，當兄弟元件缺少容器時
  • 讓快訊訊息變成可選的 (亦即，如果您在之前沒有 fetch_flash，LiveView 還是會運作)

強化功能

  • 提升，如果 :flash 作為發給的
  • 支援使用者定義的路由中的元資料
  • 允許路由器訪問為 socket.router
  • 允許 MFArgs 作為 :session 選項在 live 路由巨集
  • 觸發在主要 LV 錯誤時載入頁面事件
  • 自動清除快訊訊息在實時導覽範例 - 只有最新指定的快訊訊息會被保留

0.8.1 (2020-02-27)

強化功能

  • 支援 phx-disable-with 在實時重新導向和實時補丁連結上

修復錯誤

  • 修復時間和日期輸入欄的焦點問題
  • 修復 LiveView 無法在以下情況下掛載的問題：在伺服器的 redirect 操作後從後退/前進快取中還原頁面
  • 修復 IE 在發布 pushState 時強制 undefined 為字串的問題
  • 修復 IE 錯誤，當焦點元素為空時發生
  • 修復使用元件和實時導覽的客戶端錯誤，其中動態範本予以呈現
  • 修復潛在的元件差異，導致元件在補丁送達前從 DOM 中移除時產生錯誤
  • 修復競爭條件，其中在伺服器上接收已透過伺服器移除的元件的元件事件會產生配對錯誤

0.8.0 (2020-02-22)

向下不相容的變更

  • 移除 Phoenix.LiveView.Flash，支持 :fetch_live_flash，由 Phoenix.LiveView.Router 匯入
  • 實時配置必須存取子內容，現在改用 @inner_content，而不是直接呼叫 LiveView
  • 不再支援從 LiveView mount 或 handle_[params|call|cast|info|event] 中傳回 :stop 組合。LiveView 會在發出 redirect 或 push_redirect 時停止

強化功能

  • 加入 put_live_layout 插件來放置用於實時路由的根配置
  • 允許 redirect 和 push_redirect 從 mount 進行
  • 使用確認追蹤以避免在伺服器已處理表單事件前來修補輸入
  • 將 CSS 載入狀態新增至所有在事件中具有特定 CSS 類別的 phx 繫結元素
  • 在視窗上發送 phx:page-loading-start 和 phx:page-loading-stop 以進行即時導覽、初始頁面載入和表單提交，用於使用者控制的頁面載入整合
  • 允許任何 phx 繫結元素指定 phx-page-loading 以便在觸發該事件時發送上述載入事件
  • 新增客戶端延遲模擬器，並加入 enableLatencySim(milliseconds) 和 disableLatencySim() 函式
  • 在 LiveSocket 中新增 enableDebug() 和 disableDebug()，以便從網頁控制台中進行依據實際情況的瀏覽器偵錯
  • 在頁面上找到 LiveView 之前，請勿連線 LiveSocket WebSocket 也不要繫結客戶端事件
  • 新增 transport_pid/1，以在 socket 連線時傳回 websocket 傳輸 pid

Bug 修復

  • 解決因 live_redirect 的掛載失敗而重新載入目前的網址，而非想要的新網址的問題

0.7.1 (2020-02-13)

Bug 修復

  • 修正某些情況下核取方塊無法將 phx-change 事件傳送至伺服器的 bug
  • 修正核取方塊的 bug，使之能維護在伺服器以程式化方式更新核取方塊時的勾選狀態
  • 修正 Firefox 中的選項元件 bug，導致在滑動狀態時 套用修補時會導致突出的索引跳動

0.7.0 (2020-02-12)

向下相容變更

  • 已移除 live_redirect，而傾向使用 push_patch（用於更新目前 LiveView 的網址和參數）和 push_redirect（用於將網址更新至另一個 LiveView）
  • 已移除 live_link，而傾向使用 live_patch（用於更新目前 LiveView 的網址和參數）與 live_redirect（用於將網址更新至另一個 LiveView）
  • Phoenix.LiveViewTest.assert_redirect 不再接受匿名函式，而是和 assert_receive 一樣，在對重新導向進行確認前執行程式碼。

強化

  • 在 LiveView 中支援 @live_view_action，以簡化網址狀態的追蹤
  • 中斷連線或進行復原時，自動復原表單輸入資料
  • 新增 phx-auto-recover 表單繫結，用於特殊復原
  • 在 live_patch 和 live_redirect 中從頁面頂端捲動，同時考量錨定雜湊目標
  • 新增 phx-capture-click ，以使用事件捕捉功能，繫結向內從目標傳遞的點擊事件
  • 重新設計閃光元件支援，讓其在靜態檢視、動態檢視和元件之間都能運作
  • 新增 phx-key 繫結至範疇 phx-window-keydown 和 phx-window-keyup 事件

錯誤修正

  • 傳送 phx-value-* 至關鍵字事件
  • 在 phx-update="ignore" 序言容器中，觸發 updated 鉤子回呼，當序言容器的屬性已變更時
  • 修正巢狀 phx-update="append" 在 LiveViewTest 中引發 ArgumentError
  • 修正更新並未套用至罕見的案例，如果一個 leex 模板被包裝於一個 if 表達式中

0.6.0 (2020-01-22)

捨棄

  • LiveView mount/2 已被捨棄，轉而使用 mount/3。目前參數傳送至 mount/3 的第一個引數，後跟工作階段及網路插座。

向後不兼容的變更

  • 網路插座工作階段目前僅接受字串鍵

強化

  • 允許視窗 beforeunload 被取消，而不會中斷 WebSocket 連線

錯誤修正

  • 修正 handle_params 未正確解碼網址路徑參數
  • 修正 LiveViewTest 錯誤，當路由於根路徑時
  • 修正 URI 編碼參數在 handle_params 中，無法被解碼
  • 修正元件目標未找到正確元件，當目標於一個 input 標籤時

0.5.2 (2020-01-17)

錯誤修正

  • 修正最佳化錯誤，導致部分 DOM 節點在更新時被移除

0.5.1 (2020-01-15)

錯誤修正

  • 修正 phx-change 錯誤，導致 phx-target 未被使用

0.5.0 (2020-01-15)

LiveView 目前在 LiveViews 中自動提供連線工作階段。不過，如此一來，您需要相應設定您的終端機，否則 LiveView 將無法連線。

步驟如下

  1. 在您的 endpoint.ex 中找到 plug Plug.Session, ... 並將選項 ... 移至一個模組屬性

     @session_options [
   ...
 ]

  2. 變更 plug Plug.Session 來說明使用該屬性

     plug Plug.Session, @session_options

  3. 同時傳送 @session_options 至您的 LiveView socket

     socket "/live", Phoenix.LiveView.Socket,
   websocket: [connect_info: [session: @session_options]]

  4. 您應在您的版面配置中定義 <head> 內部的 CSRF 中繼資料標記，於 app.js 納入前

     <meta name="csrf-token" content={Plug.CSRFProtection.get_csrf_token()} />
 <script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>

  5. 然後在您的 app.js 中

     let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content");
 let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}});

另外請注意 that 工作階段目前將具有字串鍵。如果使用原子鍵，LiveView 將會警告。

改善

  • 尊重 live_link 中的新標籤行為
  • 加入 beforeUpdate 和 beforeDestroy JS 鉤子
  • 讓所有在套接字載入時定義的配置在第一次渲染時可以在版面中取得
  • 提供支援使用新 :layout 選項的即時版面
  • 在啟用 DEBUG 模式時偵測前端上重複的 ID
  • 自動將 session 轉發到 LiveView
  • 支援 "live_socket_id" session 鍵來辨識 (並斷開連線) LiveView 套接字
  • 加入支援 hibernate_after 給 LiveView 程序
  • 支援將 live_redirect 和 redirect 重導向到完整的 URL
  • 將 offsetX 和 offsetY 加入點選事件中繼資料
  • 允許將 live_link 和 live_redirect 放在頁面的任何地方，它將始終鎖定主要 LiveView (路由器中定義的那個)

向後相容性變更

  • phx-target="window" 已被 phx-window-keydown、phx-window-focus 等取代，而 phx-target 綁定已重新用於從客戶端鎖定 LiveView 和 LiveComponent 事件
  • Phoenix.LiveView 不再定義 live_render 和 live_link。這些函式已移至 Phoenix.LiveView.Helpers，現在可以在你的檢視中完全匯入這些函式。換句話說，用 import Phoenix.LiveView.Helpers 取代 import Phoenix.LiveView, only: [live_render: ..., live_link: ...]

0.4.1 (2019-11-07)

錯誤修正

  • 修正導致輸入模糊的錯誤

0.4.0 (2019-11-07)

改善

  • 加入 Phoenix.LiveComponent 來區分 LiveView 中的狀態、標記和事件
  • 在偵測到有效但過時的 session 時，透過延遲更新來處理過時的客戶端
  • 僅將即時連結點選傳遞給路由器 LiveView
  • 套接字處於連線狀態時，重新整理頁面以優雅地從載入失敗中復原

錯誤修正

  • 修正 phx-hook 銷毀回呼在特定狀況下無法被呼叫的錯誤
  • 修正導致 LiveView 重新載入失敗的返回/前進錯誤

0.3.1 (2019-09-23)

向後相容性變更

  • 測試中的 live_isolated 不再需要路由器和管線 (它現在僅需要 3 個引數)
  • 如果在非路由器 LiveView 上使用 handle_params 則會引發

錯誤修正

  • [LiveViewTest] 修復由 HTML 註解引起的函數子句錯誤

0.3.0 (2019-09-19)

程式增強

  • 加入 phx-debounce 和 phx-throttle 繫結以調整事件比率限制

向後不相容的變更

  • IE11 支援現在需要兩個附加 polyfill，mdn-polyfills/CustomEvent 和 mdn-polyfills/String.prototype.startsWith

錯誤修正

  • 修復由不支援的 getAttributeNames 檢索引起的 IE11 支援問題
  • 修復 Floki 相依性編譯警告

0.2.1 (2019-09-17)

錯誤修正

  • [LiveView.Router] 修復模組串接無法建立正確的版面模組的錯誤（當使用自訂命名空間時）
  • [LiveViewTest] 修復 phx-update 附加/前置容器無法建立正確 DOM 內容的錯誤
  • [LiveViewTest] 修復 phx-update 附加/前置容器無法更新具有相符 ID 的現有子容器的錯誤

0.2.0 (2019-09-12)

程式增強

  • [LiveView] 在 use Phoenix.LiveView 中加入新的 :container 選項
  • [LiveViewTest] 加入 live_isolated 測試輔助器，用於測試不可路由的 LiveView

向後不相容的變更

  • 使用三元組 mount 回傳取代 configure_temporary_assigns/2，支援 :temporary_assigns 金鑰
  • 不允許在 mount 或子 live view 中使用 redirect/live_redirect
  • 所有 phx-update 容器現在都需要一個唯一 ID
  • LiveSocket JavaScript 建構函數現在需要 Phoenix Socket 建構函數的顯式相依性注入。例如
import {Socket} from "phoenix"
import LiveSocket from "phoenix_live_view"

let liveSocket = new LiveSocket("/live", Socket, {...})

錯誤修正

  • 修復 phx-update=append/prepend 沒有無法加入新的巢狀 live view 或建立新的 phx-hook 的錯誤
  • 修復數字輸入處理（導致某些瀏覽器在無效輸入時重設表單欄位）的錯誤
  • 修復多選解碼導致伺服器錯誤的錯誤
  • 修復當取消選擇值時，多選變更追蹤無法提交事件的錯誤
  • 修復在特定情況下觸發 live 重新導向循環的錯誤
  • 修復 live_redirect 後在重新 mount 時，參數無法更新的錯誤
  • 修復模糊事件元資料會以 "focus" 類型傳送的錯誤

0.1.2 (2019-08-28)

向後不相容變更

  • phx-value 不再生效，請改用 phx-value-*
  • Session 中的 :path_params 鍵不再生效 (請改在 LiveView 中使用 handle_params)

0.1.1 (2019-08-27)

增強功能

  • 使用最佳化的 insertAdjacentHTML 以加快附加/前置，同時適當處理 CSS 動畫
  • 允許於附加/前置過程中更換已附加/前置的元素，方法是在附加/前置過程中替換重複的 ID，而不是新增 DOM 節點

錯誤修正

  • 修正當父內容更新時，會重複執行附加/前置更新項
  • 修正附加和前置內容時不會套用 JS 掛鉤項

0.1.0 (2019-08-25)

增強功能

  • 現在，LiveView handle_in/3 回應會收到一個包含有關客戶端事件之 meta 資料的對應
  • 對於 phx-change 事件，handle_in/3 現在會收到一個表示觸發變更之表單輸入名稱之鑰匙空間的 "_target" 參數
  • 可以使用 phx-value- 前置字元為任何 phx 繫結提供多個值，例如 phx-value-myval1、phx-value-myval2，等等
  • 透過 phx-update 新增對 DOM 修補的控管，其可設定為 "replace"、"append"、"prepend" 或 "ignore"

向後不相容變更

  • phx-ignore 已重新命名為 phx-update="ignore"