vue学习中遇到的onchange、push、splice、forEach方法使用

您所在的位置:网站首页 select中onchange用法 vue学习中遇到的onchange、push、splice、forEach方法使用

vue学习中遇到的onchange、push、splice、forEach方法使用

2023-07-27 21:48| 来源: 网络整理| 查看: 265

最近在做vue的练习,发现有些js中的基础知识掌握的不牢,记录一下:

1、onchange事件:是在域的内容改变时发生,单选框与复选框改变后触发的事件。

2、push方法:向数组的末尾添加一个或多个元素,并返回新的长度 array.push(item1,item2,...,itemx)

3、splice方法:用于插入、删除或替换数组元素 array.splice(index,howmany,item1,...itemx)

4、forEach()方法:用于调用数组的每一个元素,并将元素传递给回调函数。array.forEach(function(currentValue,index,arr),thisValue)

                                                          

例子:计算未采购的数量

添加 未采购数{{num}}           {{item.sName}} {{item.flag}} 删除

 

js部分: new Vue({ el:'myList', data:{ num:0, listArr:[{sName:'衣服',flag:false},{sName:'鞋子',flag:false},{sName:'裙子',flag:false}] }, methods:{ addClick:function(text){ if(text=='') return;//输入为空就返回 this.listArr.push({sName:text,flag:true})//添加 this.text=''//添加后输入框清空 this.action() }, action:function(){ var _this=this; _this.num=0; this.listArr.forEach(function(item,index)){ if(!item.flag){ _this.num++ } }) }, del:function(i){ this.listArr.splice(i,1) } } })

 

 



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3