qq_36730529
路人甲12137
采纳率90.9%
2019-10-23 10:39

vue 使用v-for循环输出图标

10
已采纳

使用v-for循环出一排七个不同的图标

<el-row>
    <el-col :span="3" v-for="(index,item) in 7" style="text-align:center">
        <svg-icon icon-class="user" ></svg-icon>
    </el-col>
</el-row>

####大致代码这个样子的,但是不太懂数据绑定啥的,求大神指点一下萌新

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • u012308481 nihaoye000 2年前

    自己先定义图标数据,再在template里面遍历它
    javascript

    data(){
        return {
            icons:["icon-user","icon-iphone","其他图标样式"]
        }
    }
    

    template

    <el-row>
        <el-col :span="3" v-for="(index,item) in icons" style="text-align:center">
            <svg-icon :icon-class="item" ></svg-icon>
        </el-col>
    </el-row>
    
    点赞 评论 复制链接分享