本文实例讲述了某视频剪辑软件基于两个计算属性实现选中和全选功能。分享给大家供大家参考，具体如下：

还是选中和全选功能，用两个计算属性来实现，别人的代码，思维确实不一样。学习了

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 ' titlewww.jb51.net vue选中和全选/title style table，td，th { border:1px solid # ebebeb边框塌陷：文本对齐：中心；}表格{ width:500px}/style脚本src=' http :https://cdn。bootscs。com/vue/2。4 .4/vue。量滴js '/script/head dy div class=' app ' table和tr th style='行高： 38px '选中数{ { checkedCount } }输入类型=' checkbox ' v-model=' all checked ' style=' zoom :200%；垂直对齐：中间/第几个名称/第几个名称/第几个名称/第几个名称/第几个名称/第几个名称/广告正文列表中的项目t输入类型=' checkbox ' v-model=' item。选中' style=' zoom 3360200% '/TD { { item }。名称} }/TD TD { { item }。age } }/TD/tr/t body/table/div脚本var list=[{ name : '小明，年龄： 23，勾选： false }，{ name: '小红，年龄： 2,检查：为真，{姓名： '小蓝，年龄： 23,已检查：是否为真，{ name: '小‘呗，年龄： 40,已检查： true }，{ name: '王小二，年龄： 18，勾选： false }]新Vue({ El : ' .app '、data: { list }、computed : { all checked : {//getter get : function(){ return this。名单。长度==这个。已检查计数}、//setter set :函数(val){//val就是点击之后，全选按钮的v型值（状态),勾上后就是英国压力单位的值就是真的。未勾上就是假控制台。记录这个。名单。foreach(item={ item。checked=val })}，checked count : {//getter get : function(){ var I=0 this。名单。foreach(item={ if(item。选中===true)I })返回I } } } })/脚本/正文/html使用在线HTML/CSS/JavaScript代码运行工具：http://工具。JB 51。net/code/HTMljsrun测试上述代码，可得如下运行效果：

希望本文所述对大家vue.js程序设计有所帮助。