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 相关文章推荐
利用location.hash实现跨域iframe自适应
May 04 Javascript
js取滚动条的尺寸的函数代码
Nov 30 Javascript
JS对象转换为Jquery对象实现代码
Dec 29 Javascript
JavaScript设计模式之单例模式实例
Sep 24 Javascript
javascript事件模型介绍
May 31 Javascript
Node.JS文件系统解析实例详解
May 15 Javascript
bootstrap模态框嵌套、tabindex属性、去除阴影的示例代码
Oct 17 Javascript
浅谈Vue.nextTick 的实现方法
Oct 25 Javascript
浅析Javascript中双等号(==)隐性转换机制
Oct 27 Javascript
详解如何用VUE写一个多用模态框组件模版
Sep 27 Javascript
js打开word文档预览操作示例【不是下载】
May 23 Javascript
vue print.js打印支持Echarts图表操作
Nov 13 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
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
利用PHP制作简单的内容采集器的原理分析
2008/10/01 PHP
关于PHP开发的9条建议
2015/07/27 PHP
Zend Framework自定义Helper类相关注意事项总结
2016/03/14 PHP
使用ThinkPHP生成缩略图及显示
2017/04/27 PHP
Yii Framework框架开发微信公众平台示例
2020/04/26 PHP
从URL中提取参数与将对象转换为URL查询参数的实现代码
2012/01/12 Javascript
简单实用jquery版三级联动select示例
2013/07/04 Javascript
Jquery 类网页微信二维码图块滚动效果具体实现
2013/10/14 Javascript
自己动手手写jQuery插件总结
2015/01/20 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
2015/07/05 Javascript
RequireJS入门一之实现第一个例子
2015/09/30 Javascript
JS实现的3D拖拽翻页效果代码
2015/10/31 Javascript
JavaScript驾驭网页-获取网页元素
2016/03/24 Javascript
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
2017/04/10 jQuery
node实现简单的反向代理服务器
2017/07/26 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
2018/01/09 Javascript
详解JS函数stack size计算方法
2018/06/18 Javascript
ajax与jsonp的区别及用法
2018/10/16 Javascript
[54:54]Newbee vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python中encode()方法的使用简介
2015/05/18 Python
Python多进程同步简单实现代码
2016/04/27 Python
Django在win10下的安装并创建工程
2017/11/20 Python
Python之列表实现栈的工作功能
2019/01/28 Python
python3实现钉钉消息推送的方法示例
2019/03/14 Python
Python如何筛选序列中的元素的方法实现
2019/07/15 Python
python 使用cycle构造无限循环迭代器
2020/12/02 Python
html5实现九宫格抽奖可固定抽中某项奖品
2020/06/15 HTML / CSS
美国最受欢迎的度假目的地优惠套餐:BookVIP
2018/09/27 全球购物
财务经理岗位职责
2013/11/09 职场文书
研发工程师岗位职责
2014/04/28 职场文书
酒店员工培训方案
2014/06/02 职场文书
七夕情人节促销方案
2014/06/07 职场文书
文明礼仪标语
2014/06/13 职场文书
Python中rapidjson参数校验实现
2021/07/25 Python
HTML CSS 一个标签实现带动画的抖音LOGO
2022/04/26 HTML / CSS