第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

僅顯示具有某些屬性的元素 Vue JS

僅顯示具有某些屬性的元素 Vue JS

紫衣仙女 2022-12-02 16:56:24
我正在開發(fā)一個 Vue 應(yīng)用程序,我有一個這樣的電影列表:movies [  {name: 'spider-man', id: 3},  {name: 'thor'},  {name: 'x-men', id: 7}]這是我的模板<ul> <li v-for="movie in movies" :key="movie.name">{{movie.name}}</li></ul>我只想展示擁有 ID 的電影,在這種情況下,不應(yīng)該展示雷神。我嘗試過使用 v-if,但出現(xiàn)此錯誤:“'v-for' 指令中的 'movies' 變量應(yīng)替換為返回過濾數(shù)組的計算屬性。你不應(yīng)該將 'v-for' 與'v-如果'”。謝謝,希望你能幫助我!
查看完整描述

2 回答

?
蕪湖不蕪

TA貢獻(xiàn)1796條經(jīng)驗 獲得超7個贊

計算屬性來拯救:


data: () => ({

  movies: [

   {name: 'spider-man', id: 3},

   {name: 'thor'},

   {name: 'x-men', id: 7}

  ]

})

...

computed: {

  moviesWithId() {

    return this.movies.filter(movie => movie.id)

  }

}

...

在你的模板中


<ul>

  <li v-for="movie in moviesWithId" :key="movie.name">{{movie.name}}</li>

</ul>


查看完整回答
反對 回復(fù) 2022-12-02
?
至尊寶的傳說

TA貢獻(xiàn)1789條經(jīng)驗 獲得超10個贊

或者你可以添加條件來渲染你的 li 標(biāo)簽,比如 v-show="movie.id"

或者像這樣過濾你的數(shù)據(jù)集:

<li v-for="movie in movies.filter(movie => movie.id)" :key="movie.name">{{movie.name}}</li>



查看完整回答
反對 回復(fù) 2022-12-02
  • 2 回答
  • 0 關(guān)注
  • 162 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號