账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    img的src如何绑定v-for循环的变量值?
    42
    0

    1.现有一v-for循环,输出每个对象comment,comment用element卡片组件分别输出其各个属性值
    2.comment有一属性comsimghead存放图片名称,首先用v-if判断是否为空,若为空,img src="../images/head/head.jpg",这个没有问题,但是不为空怎么让src为"../images/head/"+comsimghead呢?(实现全部转换太麻烦,并且转换为后src=后面也不能写变量值啊,还得在data声明变量)
    3.代码如下:

                <el-col :span="12" v-for="comment in currentcomments" :key="comment.comid" :offset="1" style="margin-bottom:40px">
                        <el-card :body-style="{ padding: '0px', height:'200px'}" style="width: 800px;height: 200px;">
                            <div style="padding: 6px;height: 180px;">
                                <div style="height:50px;"><!--头像与用户名-->
                                    <div style="float: left;width: 50px;height: 50px;" v-if="comment.comsimghead ==null || comment.comsimghead ==''">
                                        <img src="../images/head/head.jpg" style="height: 40px;width: 40px;border-radius: 20px;margin: 10px 0px 10px 10px;" />
                                    </div>
                                    <div style="float: left;width: 50px;height: 50px;" v-else><!--这里的src怎么设置?-->
                                        <img src="../images/head/" style="height: 40px;width: 40px;border-radius: 20px;margin: 10px 0px 10px 10px;" />
                                    </div>
                                    <div style="float: left;position:relative;top:20px;width:300px;height: 30px;"><font size="5">&nbsp;{{comment.comsname}}</font></div>
                                </div>
                            </div>
                        </el-card>
                    </el-col>
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 在Vue中,你可以使用v-for循环和img的src属性来绑定v-for循环的变量值。以下是一个例子:

      html <img :src="myImageSrc" v-for="(image, index) in myImageArray" :key="index">

      在这个例子中,myImageSrc是你的img的src属性,myImageArray是你的img数组,index是图片的索引。

      在循环中,index的值将被赋值给imagesrc属性。这就是为什么你可以在图片上看到你的变量值。

      如果你想要动态获取图片的src,你可以在循环外部设置一个变量来存储你的图片数组的索引,然后在循环内部通过这个索引获取图片的src。

      ```html

      ```

      在这个例子中,myImageArray是一个数组,包含了3个对象,每个对象都有一个src属性和一个index属性。当你通过索引获取图片的src时,index的值将被赋值给src

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部