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>
  • 相关阅读:
    NoSQL 数据库中的 CAP 理论
    JVM 相关概念
    Servlet 生命周期
    RabbitMQ
    消息队列概述
    05.类加载器深入解析及重要特性剖析
    LINUX笔记3(用户管理)
    LINUX笔记2(创建和编辑文本)
    修改httpd端口后,服务不能启动。
    LINUX笔记1(命令行和目录结构)
  • 原文地址:https://www.cnblogs.com/kukai/p/12856528.html
Copyright © 2011-2022 走看看