目錄

• 前言
  
• 問題
  
• 網上的解決方案

前言

提前說明哦，這是一篇很基礎類的文章，只適合小小白閱讀，因為以下文章內容來源於我剛入行時的筆記。各位高人請繞道，避免浪費時間，謝謝~

今天主要來談一下element-ui編輯表單中的el-radio回顯之後無法選擇的問題，主要涉及到的雙向繫結，以及element-ui編輯表單中的el-radio的預設型別。

問題

這是一個困擾了我半上午的bug，表單樣式及程式碼如下。

問題是回顯資料之後，當我點選其FlLXXCjfb他的rhttp://www.cppcns.comadio想要選擇的時候，勾選不了。

在網上找到了一樣的問題，有解決方案，同樣沒有找到原因。

網上的解決方案

原本是把從後臺得到的資料res.data直接賦值給editPowerForm，現在需要先把res.data賦值給let obj，然後再由obj賦值給editPowerForm，就可以了。

原因是editPowerForm沒有宣告radio這一變數，vue中對資料雙向繫結的支援限於基本新增刪除的方法，詳情看官網。在這裡相當於直接賦值給未宣告的變數，所以雙向繫結不會被vue監聽，即沒有重新整理。而先賦值給obj，相當於radio在被賦值前已經被聲明瞭，所以可以被雙向繫結監聽到。

說的有點繞，總之就是物件的某個屬性要先被建立，才能被vue雙向繫結監聽到。

還有需要注意的是：

radio的值預設應該是string型別，如果後臺返回的值是int型別，radio同樣不會預設選中。

總所周知，在引用物件時，引用的其實是一個索引地址，也因此前端才延伸出深拷貝淺拷貝的http://www.cppcns.com所在，當物件內只發生改變時，索引值其實是不變的，即舊值與新值相同，因為它們索引指向的都是同一個物件。

其實直接使用$set，或者watch進行深度監聽也是可以的。慶幸的是，現在vue3中使用proxy代理來實現雙向繫結，再也不用擔心陣列/物件發生變化卻監聽不到的問題了！

到此這篇關於element編輯表單el-radio回顯之後無法選擇的問題解決的文章就介紹到這了,更多相關el-radio回顯無法選擇內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！