vue 解决computed修改data数据的问题


Posted in Javascript onNovember 06, 2019

最近在做项目的时候遇见一个问题,computed修改data数据的时候会报错。报错的大概意思是,不可以修改data数据的属性值。查了一些答案,最终解决办法是需要用到set和get。看代码:

data () {
  return {
   fold: false
 }
}

我想修改fold的值,如果不用get和set就会报错!!!

computed:{
  listShow: {
    get: function () {
      if (!this.totalCount) {
       return false
      }
      return this.fold
     },
    set: function () {
      if (!this.totalCount) {
      this.fold = false
      return false
    }
  }
}

get里面的值可以在页面加载或者数据改变的时候实时更新,但是set方法里面的如果想起作用,你需要调用listShow才会起作用。

看代码:

methods: {
  toggleList () {
   if (!this.totalCount) {
    return
   }
   this.listShow = false//这里需要调用一下
   this.fold = !this.fold
  },
}

如果不调用的情况下,逻辑都写到get里面,就可以实时更新了。

以上这篇vue 解决computed修改data数据的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用jQuery简化JavaScript开发分析
Feb 19 Javascript
jQuery获取注册信息并提示实现代码
Apr 21 Javascript
基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解
May 07 Javascript
当前页禁止复制粘贴截屏代码小集
Jul 24 Javascript
js实现简单的购物车有图有代码
May 26 Javascript
js实现文字向上轮播功能
Jan 13 Javascript
让你5分钟掌握9个JavaScript小技巧
Jun 09 Javascript
jQuery中ajax请求后台返回json数据并渲染HTML的方法
Aug 08 jQuery
jQuery超简单遮罩层实现方法示例
Sep 06 jQuery
详解Vue改变数组中对象的属性不重新渲染View的解决方案
Sep 21 Javascript
4个顶级JavaScript高级文本编辑器
Oct 10 Javascript
如何从零开始手写Koa2框架
Mar 22 Javascript
微信小程序页面渲染实现方法
Nov 06 #Javascript
微信小程序页面间传递数组对象方法解析
Nov 06 #Javascript
vue 获取及修改store.js里的公共变量实例
Nov 06 #Javascript
对vuex中getters计算过滤操作详解
Nov 06 #Javascript
node解析修改nginx配置文件操作实例分析
Nov 06 #Javascript
vuex实现像调用模板方法一样调用Mutations方法
Nov 06 #Javascript
vuex actions异步修改状态的实例详解
Nov 06 #Javascript
You might like
PHP 和 HTML
2006/10/09 PHP
php中显示数组与对象的实现代码
2011/04/18 PHP
thinkphp备份数据库的方法分享
2015/01/04 PHP
PHP使用flock实现文件加锁的方法
2015/07/01 PHP
php实现在线考试系统【附源码】
2018/09/18 PHP
Ajax+PHP实现的分类列表框功能示例
2019/02/11 PHP
Laravel框架自定义分页样式操作示例
2020/01/26 PHP
JavaScript eval() 函数介绍及应用示例
2014/07/29 Javascript
最全的Javascript编码规范(推荐)
2016/06/22 Javascript
node.js express中app.param的用法详解
2017/07/16 Javascript
微信小程序中post方法与get方法的封装
2017/09/26 Javascript
基于node下的http小爬虫的示例代码
2018/01/11 Javascript
vue.js项目nginx部署教程
2018/04/05 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
基于vue实现圆形菜单栏组件
2019/07/05 Javascript
微信小程序如何使用canvas二维码保存至手机相册
2019/07/15 Javascript
element-ui tree结构实现增删改自定义功能代码
2020/08/31 Javascript
如何在 ant 的table中实现图片的渲染操作
2020/10/28 Javascript
[02:33]DOTA2英雄基础教程 司夜刺客
2013/12/04 DOTA
举例讲解Linux系统下Python调用系统Shell的方法
2015/11/07 Python
python生成二维码的实例详解
2017/10/29 Python
python opencv检测目标颜色的实例讲解
2018/04/02 Python
Python解决pip install时出现的Could not fetch URL问题
2019/08/01 Python
python 实现生成均匀分布的点
2019/12/05 Python
pytorch 计算Parameter和FLOP的操作
2021/03/04 Python
英国电信商店:BT Shop
2019/12/17 全球购物
运动会通讯稿500字
2014/02/20 职场文书
小班秋游活动方案
2014/02/22 职场文书
国际经济与贸易专业求职信
2014/07/10 职场文书
书法社团活动总结
2015/05/07 职场文书
2016暑期社会实践心得体会范文
2016/01/14 职场文书
《弟子规》读后感:知廉耻、明是非、懂荣辱、辨善恶
2019/12/03 职场文书
golang生成并解析JSON
2022/04/14 Golang
使用Python通过企业微信应用给企业成员发消息
2022/04/18 Python
mysql中如何用命令创建联合唯一索引
2022/04/20 MySQL
详解Mysq MVCC多版本的并发控制
2022/04/29 MySQL