v-for 循环

<body id=app>
    <!-- 用一个 v-for 循环，依次展示数据 -->
    <div v-for="article in articles">
        <h3>{{ article.title }}</h3>
        <p>{{ article.content }}</p>
    </div>
    <script>
    var vm = new Vue({
        el: "#app",

        data: {
            // 有多条数据的时候，用数组包装
            articles: [
            {title: "标题 1", content: "内容1"}, 
            {title: "标题 2", content: "内容2"}, 
            {title: "标题 3", content: "内容3"}
            ]
        }

    })
    </script>
</body>

网页如下：

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容