vue 列表渲染 v-for

最新推荐文章于 2024-07-18 18:59:22 发布

春疯得意

最新推荐文章于 2024-07-18 18:59:22 发布

阅读量1k

点赞数

分类专栏： vue javascript ECMAScript 6

本文链接：https://blog.csdn.net/zj1206358260/article/details/94399707

版权

本文详细介绍了Vue.js中的v-for指令如何用于遍历数组和对象。重点在于，Vue重写了数组的一些方法，以确保在内部数据变化时能够自动更新视图。通过对数组方法的拦截，Vue确保了数据变化的同步更新。

摘要由CSDN通过智能技术生成

v-for 遍历数组
v-for 指令：vue 本身只是监视了 list 的改变，没有监视数组内部数据的变化，vue 重写了数组中的一系列改变数组内部数据的方法（先条用原生，再更新界面）

<html>
    <header>
        <meta charset="uft-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <title>v-for</title>
    </header>

    <script >
        window.onload = function(){
			//vue 本身只是监视了 list 的改变，没有监视数组内部数据的变化
			//vue 重写了数组中的一系列改变数组内部数据的方法（先条用原生，再更新界面）
            new Vue({
                el:"#one",
                data: {
                    list:[{name:'zhou',age:22},{name:'zhang',age:23},{name:'tom',age:22},{name:'alice',age:22}]
                },

最低0.47元/天解锁文章

春疯得意

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
vue 列表渲染 v-for

v-for 指令：vue 本身只是监视了 list 的改变，没有监视数组内部数据的变化，vue 重写了数组中的一系列改变数组内部数据的方法（先条用原生，再更新界面）<html> <header> <meta charset="uft-8"> <meta name="viewport" content="width=...
复制链接

扫一扫

专栏目录