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 相关文章推荐
javascript 按回车键相应按钮提交事件
Nov 02 Javascript
颜色选择器 Color Picker,IE,Firefox,Opera,Safar
Nov 25 Javascript
scrollWidth,clientWidth,offsetWidth的区别
Jan 13 Javascript
js实现鼠标划过给div加透明度的方法
May 25 Javascript
深入探究JavaScript中for循环的效率问题及相关优化
Mar 13 Javascript
jQuery UI Bootstrap是什么?
Jun 17 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
Aug 31 Javascript
Vue.js中用v-bind绑定class的注意事项
Dec 13 Javascript
JS中的phototype详解
Feb 04 Javascript
基于Vue实现tab栏切换内容不断实时刷新数据功能
Apr 13 Javascript
Node.js  REPL (交互式解释器)实例详解
Aug 06 Javascript
Vue实现圆环进度条的示例
Feb 06 Vue.js
微信小程序页面渲染实现方法
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
通达OA公共代码 php常用检测函数
2011/12/14 PHP
百度站点地图(百度sitemap)生成方法分享
2014/01/09 PHP
thinkPHP中session()方法用法详解
2016/12/08 PHP
PHP编程实现脚本异步执行的方法
2017/08/09 PHP
Smarty模板类内部原理实例分析
2019/07/03 PHP
php使用curl模拟多线程实现批处理功能示例
2019/07/25 PHP
Jquery拖拽并简单保存的实现代码
2010/11/28 Javascript
jquery遍历checkbox的注意事项说明
2014/02/21 Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
2014/07/17 Javascript
如何正确使用Nodejs 的 c++ module 链接到 OpenSSL
2014/08/03 NodeJs
简介alert()与console.log()的不同
2015/08/26 Javascript
详解jQuery UI库中文本输入自动补全功能的用法
2016/04/23 Javascript
利用Vue.js框架实现火车票查询系统(附源码)
2017/02/27 Javascript
在 Angular 中实现搜索关键字高亮示例
2017/03/21 Javascript
EasyUI Datebox 日期验证之开始日期小于结束时间
2017/05/19 Javascript
webpack构建vue项目的详细教程(配置篇)
2017/07/17 Javascript
AngularJS实现表单验证功能详解
2017/10/12 Javascript
VUE2.0中Jsonp的使用方法
2018/05/22 Javascript
Node.js API详解之 net模块实例分析
2020/05/18 Javascript
[42:52]Optic vs Serenity 2018国际邀请赛淘汰赛BO3 第二场 8.22
2018/08/23 DOTA
Python新手在作用域方面经常容易碰到的问题
2015/04/03 Python
python3实现公众号每日定时发送日报和图片
2018/02/24 Python
python基于K-means聚类算法的图像分割
2019/10/30 Python
pytorch如何冻结某层参数的实现
2020/01/10 Python
关于Keras Dense层整理
2020/05/21 Python
django Model层常用验证器及自定义验证器详解
2020/07/15 Python
Opodo英国旅游网站:预订廉价航班、酒店和汽车租赁
2018/07/14 全球购物
诗普兰迪官方网站:Splendid
2018/09/18 全球购物
西雅图电动自行车公司:Rad Power Bikes
2020/02/02 全球购物
介绍一下SQL注入攻击的种类和防范手段
2012/02/18 面试题
《草原的早晨》教学反思
2014/04/08 职场文书
2014领导班子正风肃纪思想汇报
2014/09/18 职场文书
致地震灾区的慰问信
2015/03/23 职场文书
消防演习感想
2015/08/10 职场文书
2015年小学体育教师工作总结
2015/10/23 职场文书
使用CSS连接数据库的方式
2022/02/28 HTML / CSS