点击不同图片的时候,才会出现隐藏层,怎么处理

<div class="content" v-for="(item,ii) in date.date" :key='ii'>
                <div>{{ii}}</div>
                <div class="imglist">
                    <div class="image" v-for="(itemson,a) in item" :key='a'>
                        <img :src="'http://test.admin.tc.qianji.org.cn/storage/'+itemson.photo_url"
                            @click="show">
                        <div class="in" v-if="inde">
                            <span>X</span>
                            <span>入档</span>
                        </div>
                    </div>
                </div>
            </div>


点击一个,显示一个,而不是一下子都显示出来

img

1、在data中定义一个当前下标 currIndex;
2、图片点击show 方法内将index 赋值给currIndex
3、在图片下方需要显示的div上加判断 当前下标是否等于index

<div class="content" v-for="(item,ii) in date.date" :key='ii'>
                <div>{{ii}}</div>
                <div class="imglist">
                    <div class="image" v-for="(itemson,a) in item" :key='a'>
                        <img :src="'http://test.admin.tc.qianji.org.cn/storage/'+itemson.photo_url"
                            @click="show">
                        <div class="in" v-if="currIndex==index">
                            <span>X</span>
                            <span>入档</span>
                        </div>
                    </div>
                </div>
            </div>


你是循环出来的,你直接给循环数组对象添加一个key 用来控制当前图片是否隐藏,然后点击让其变更状态即可

img绑定自定义属性data-srcsrc放个默认图片,点击哪个,将src换成data-src的地址