vue 通过类名绑定 来 自动切换 (动态)换图_vue怎么判断循环的标签的类名修改另一个标签的图片(2)

最后

我可以将最近整理的前端面试题分享出来，其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器、数据结构与算法等等，还在持续整理更新中，希望大家都能找到心仪的工作。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

篇幅有限，仅展示部分截图：

贴一下标签代码：

                <!-- 小车的位置 -->
                <div class="positions">
                    <div id="act_point"
                        v-if="lines.line.lineId === item.lineId"
                        v-for="(item,index) in positions" :key="index"
                        :style="{left: item.left + 'px', bottom: item.bottom + 'px'}"
                        :class="{'bg1':item.flag == true,'bg2':item.flag == false }"
                        :title=" '线路Id：' + item.lineId + ',列车编号：' + item.trainId + ',车站Id：' + item.stationBId"></div>
                </div>

贴一下css主要代码：

/* 小车 */
.positions {
    width: 100%;
    position: relative;
    top: -120px;
}
.positions #actpoint {
    position: absolute;
    bottom: 20px;
    left: -6px;
    width: 50px;
    height: 22px;
    /* background: url('/static/img/tain1.png') no-repeat; */
    cursor: pointer;
}

.bg1{
    position: absolute;
    bottom: 20px;
    left: -6px;
    width: 50px;
    height: 22px;
    background: url('/static/img/tain1.png') no-repeat;
    cursor: pointer;
}
.bg2{
    position: absolute;
    bottom: 20px;
    left: -6px;
    width: 50px;
    height: 22px;
    background: url('/static/img/tain.png') no-repeat;
    cursor: pointer;
}


### 总结

我在成长过程中也是一路摸爬滚打，没有任何人的指点，所以走的很艰难。例如在大三的时候，如果有个学长可以阶段性的指点一二，如果有已经工作的师兄可以告诉我工作上需要什么，我应该前面的三年可以缩短一半；后来去面试bat，失败了有5、6次，每次也不知道具体是什么原因，都是靠面试回忆去猜测可能是哪方面的问题，回来学习和完善，当你真正去招人的时候，你就会知道面试记录是多么重要，面试官可以从面试记录里看到你的成长，总是去面试，总是没有成长，就会被定义为缺乏潜力。

**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**

![image](https://img-blog.csdnimg.cn/img_convert/b67f1b15484e086fc6c384299e283db9.webp?x-oss-process=image/format,png)
![image](https://img-blog.csdnimg.cn/img_convert/6a9b368e9a2673b83e163eb75124091d.webp?x-oss-process=image/format,png)


[外链图片转存中...(img-5SwaTPLR-1715827674144)]
[外链图片转存中...(img-ziDjMtDV-1715827674145)]