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>
  • 相关阅读:
    nginx开机自启动
    解决This system is not registered with RHN
    数据库琐表
    linux启动和关闭防火墙命令
    linux端口开放
    linux常用命令
    dedecms编辑器不能复制word格式的处理方法
    dede5.7 标题长度限制修改
    网站收录地址大全
    最全的各搜索引擎、各免费收录提交网站入口大全
  • 原文地址:https://www.cnblogs.com/kukai/p/12856528.html
Copyright © 2011-2022 走看看