zoukankan      html  css  js  c++  java
  • 数组的splice用法示例

    数组总元素为对象操作示例:

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
      </head>
      <body>
        <div id="app">
          <template v-for="user in userInfo">
            <li>姓名:{{user.name}}</li>
            <li>年龄:{{user.age}}</li>
            <li>--------------------</li>
          </template>
        </div>
        <script>
            var v=new Vue({
                el:"#app",
                data:{
                    userInfo:[{name:"zhangsan",age:28},
                             {name:"lisi",age:28},
                    ]
                }
            });
        //第一参数:数组中的索引, 第二参数 :要替换的个数, 第三个之后的参数:为要替换的值
            v.userInfo.splice(2,2,{name:'wangwu',age:30},{name:'zhaoliu',age:32});
        </script>
      </body>
    </html>
     
    数组中元素为普通元素的操作示例
     
    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
      </head>
      <body>
        <div id="app">
          <template v-for="user in userInfo">
            <li>姓名:{{user}}</li>
          </template>
        </div>
        <script>
            var v=new Vue({
                el:"#app",
                data:{
                    userInfo:['zhangsan','lisi']
                }
            });
    //第一参数:数组中的索引, 第二参数 :要替换的个数, 第三个之后的参数:为要替换的值
            v.userInfo.splice(2,2,'wangwu','zhaoliu');
    //第一参数:数组中的索引, 第二参数 :要替换的个数,第三个参数为空,则为要删除 第二个参数值的个数据
            v.userInfo.splice(2,1);
        </script>
      </body>
    </html>
  • 相关阅读:
    Network(树形dp)洛谷2899
    2590 树的统计
    LCT 最小生成树
    几种贪心小结
    snmp
    div页面跳转
    2017.11.2总结,回顾及成果
    2017.11.1知识总结及回顾
    check,form,单选框与复选框总结
    HTML空格字符
  • 原文地址:https://www.cnblogs.com/kukai/p/12856528.html
Copyright © 2011-2022 走看看