zoukankan      html  css  js  c++  java
  • Vue数组更新

    <!--
    数组更新 7种 会改变原始数组的方法
    push()
    pop()
    shift()
    unshift()
    splice()
    sort()
    reverse()
    Vue检测到数据变化会更新视图


    不会改变原数组方法,可以使用新数组替代原数组
    数组变化时,并不是直接渲染,而是最大的复用DOM元素,
    替换数组的相同元素不会被重新渲染。无需担心性能问题.
    filter()
    slice()
    concat()

    Vue不能检测到
    1,通过索引直接设置项
    app.list[3] = {};
    2, 修改数组长度
    app.list.length = 1
    Vue.set(this.list, index, item);

    过滤与排序
    不想改变原数组,通过一个数组的副本做过滤或者排序、
    可以使用计算属性来返回过滤或排序后的数组


    -->
    <ol>
    <li v-for="(item,index) in computedList" :key="index">{{item.name}}-{{item.age}}</li>
    </ol>
    <button @click="setList">Vue.Set</button>
    </div>
     

    methods: {

    setList() {
    // this.list[2] = { name: "zhangsan2", age: 30 };
    this.$set(this.list, 2, {
    name: "lisi",
    age: 30
    });
    }
    },

  • 相关阅读:
    JMeter基础篇--录制web脚本(四)
    jmeter的基础使用(二)
    jmeter安装教程(一)
    delete用法(删除表内容)
    update用法(修改表内容)
    IPy对网段的处理
    netmiko
    读写conf文件
    读写json文件
    excel及数据处理
  • 原文地址:https://www.cnblogs.com/niusan/p/10389494.html
Copyright © 2011-2022 走看看