javascript - Vue 如何获取v-for 遍历出来的元素

查看:884
本文介绍了javascript - Vue 如何获取v-for 遍历出来的元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

<template>
    <div id="app" class="app">
        <div class="container">
            <div v-for="(item, index) in items">
                {{ item.name }}
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'app',
    data () {
        return {
            items: [
                {
                    name: 'a'
                },
                {
                    name: 'b'
                },
                {
                    name: 'c'
                },
                {
                    name: 'd'
                },
                {
                    name: 'e'
                },
            ]
        }
    },
    methods: {
        getWidth () {
            //  获取遍历 this.items 每个div 元素的宽度  offsetWidth;
            this.items.forEach(el => {
                // .....   怎么做?
            });
        }
    },
    mounted () {
        this.getWidth();
    }
}
</script>



只要能获取遍历出来的目标元素 什么都好说。 好像做不了?

解决方案

mounted 那里 用 this.$nextTick(()=>{this.getWidth()}) 这样试试?

这篇关于javascript - Vue 如何获取v-for 遍历出来的元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆