Vue2中点击上面块消失,下面块被点击时也会被选中

这是HTML部分的代码:

<div class="btn btn-default" @click="query=true">已完成</div><div class="btn btn-default" @click="query=false">未完成
</div><todoitem v-for="item in itemsByCalu" v-bind:i="item"></todoitem><template id='todoitem'>
 <div :class="i.weight | checkClass">
    <label>
        <input type="checkbox" v-model="i.done" @click="changeProp('done',!i.done)"/>
        <span class="cont" v-text="i.cont"></span>
        <span class="fr">{{i.time | time}}</span>
    </label>
    <span class="glyphicon glyphicon-remove fr" @click="removeItem(i)"></span></div></template>

vue中的代码

data:{    query:true,
},   
computed:{    itemsByCalu:function(){
        return _.orderBy(this.items.filter(function(item){
                return item.done === vm.query;
        }),[this.order],[this.sc]);
    },
}

点击块之前

https://img4.mukewang.com/5becd5ca0001013d02380229.jpg

点击块之后

https://img1.mukewang.com/5becd5d500012a4602320200.jpg

因为第一个块点中之后通过数据筛选会消失,但是不清楚为什么第二个块上去之后也为被点中取消,但是数据没有被修改。刷新之后还是选中的状态!

慕标琳琳
浏览 684回答 1
1回答

翻阅古今

<todoitem&nbsp;v-for="item&nbsp;in&nbsp;itemsByCalu"&nbsp;v-bind:i="item"&nbsp;:key="value"></todoitem>key用来标识每一条数据
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript