如果使用v-for遍历数据时,想筛选出URL不为空的项并进行渲染
<ul> <li v-for="(item,index) in list" v-if="item.url" :key="index"> {{ item.name }} </li> </ul>
但是v-for和v-if无法同时使用,这时就可以在computed中进行筛选操作
<ul> <li v-for="(item,index) in musicList" :key="index"> {{ item.name }} </li> </ul> data () { return { list: [] }; }, computed: { musicList: function () { return this.list.filter(function (item) { return item.url;//返回item.url不为空的项,添加到musicList数组 }) } },