這篇文章將為大家詳細(xì)講解有關(guān)vue中更改數(shù)組中屬性在頁(yè)面中不生效怎么辦，小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

創(chuàng)新互聯(lián)建站是一家專注于成都網(wǎng)站建設(shè)、成都做網(wǎng)站與策劃設(shè)計(jì),內(nèi)江網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)建站做網(wǎng)站,專注于網(wǎng)站建設(shè)10余年,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:內(nèi)江等地區(qū)。內(nèi)江做網(wǎng)站價(jià)格咨詢:18982081108

問(wèn)題描述：

使用vue的方法獲取了數(shù)組數(shù)據(jù)，獲取數(shù)據(jù)后為每個(gè)數(shù)據(jù)增加edit屬性，初始值均為false，其目的是為了當(dāng)點(diǎn)擊列表中的編輯按鈕時(shí)，控制保存與不保存的按鈕的出現(xiàn)與消失，結(jié)果當(dāng)更改數(shù)組中的edit屬性后，頁(yè)面并沒(méi)有如預(yù)期的那樣當(dāng)edit為true時(shí)頁(yè)面顯示更改狀態(tài)，當(dāng)edit為false時(shí)為不更改狀態(tài)

解決方案：

edit是在通過(guò)post方法獲取數(shù)據(jù)后增加到vue的data數(shù)據(jù)中的屬性，一開(kāi)始我的做法先將接收到的數(shù)據(jù)賦值到vue的data中，再對(duì)vue的data中的數(shù)據(jù)增加edit屬性，這樣在改變edit的之后，雖然在js中使用console.log可以看到該值已經(jīng)發(fā)生變化，但頁(yè)面中的data值并沒(méi)有發(fā)生變化。

正確的做法應(yīng)該是先為接收到的數(shù)據(jù)初始化edit屬性，再將處理后的數(shù)據(jù)賦值給vue的data。

代碼如下

     
      
       {{book.orderIndex}} //如果edit屬性為false，則該span出現(xiàn)
        //如果edit屬性為true，則該input出現(xiàn)
      
      
        //如果edit屬性為true，出現(xiàn)不保存(x)按鈕
        

        //如果edit屬性為true，出現(xiàn)保存(√)按鈕
        
       
      
      
     
    

關(guān)于“vue中更改數(shù)組中屬性在頁(yè)面中不生效怎么辦”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。