使用场景:ant-vue 穿梭框使用

页面使用computed方法处理组织结构数据,退出页面时,对加载数据做了set null 操作,再次进入页面时,穿梭框只显示数据,无法做左右穿梭功能。

原因:computed方法在页面初始化时执行,且只执行一次,并会将方法内的数据进行缓存。退出页面做了数据清除工作,但并为清楚缓存数据,导致两边数据冲突,穿梭框数据并未正常渲染。

解决办法:取消退出页面时组件数据的set null操作,在打开页面时对重新加载的组件数据做是否存在判断,若不存在,再重新获取数据进行渲染。

vue 之 computed方法自带缓存踩坑1的更多相关文章

  1. RabbitMq在CentOs7下的完整安装步骤,带你踩坑

    1.前言 因为公司项目中用的RabbitMq来做消息处理,自己以前没有接触过,所以想自学一下.然额,光安装就花了6.7个小时才搞定,中间还换过一个版本,综合国内外博客才最终将所有安装中遇到的问题解决掉 ...

  2. .net Core发布至IIS完全手册带各种踩坑

    服务器环境配置 和各位大爷报告一下我的服务器环境 : Windows Server 2012 iis 8 小插曲开始: 运维大哥在昨天给了我一台新的server 0环境开始搭建 . 并且没有安装任何的 ...

  3. VUE使用微信JDK(附踩坑记录)

    VUE使用微信分享SDK(附踩坑记录) 微信分享官方文档 安装JS-SDK npm i -S weixin-jsapi 引入包 ES5 写法 const wx = require('weixin-js ...

  4. 微信小程序踩坑之一[thist]使用技巧

    刚上手小程序 时,习惯把this当成jquery中的$(this)来用,实际上这两个还是有差别的 在页面方法中调用其他方法,一般是用this.function(),直接调用小程序 的方法或函数则是用w ...

  5. vue踩坑之旅 -- computed watch

    vue踩坑之旅 -- computed watch 经常在使用vue初始化组件时,会报一些莫名其妙的错误,或者,数据明明有数据,确还是拿不到,这是多么痛苦而又令人忍不住抓耳挠腮,捶胸顿足啊 技术点 v ...

  6. Vue packages version mismatch的解决方法 初来乍到,踩坑日常

    初来乍到,踩坑日常 这个问题也是我也是接受别人项目,出现的问题,在下载好依赖后运行的时候报这样的错误 它上面显示两个版本一个vue的版本,一个vue-template-compiler版本,我这边忘了 ...

  7. vue中计算属性computed方法内传参

    vue中computed计算属性无法直接进行传参 如果有传参数的需求比如说做数据筛选功能可以使用闭包函数(也叫匿名函数)实现 例如: 在上篇博客vue安装使用最后的成绩表练习中的过滤功能的实现: &l ...

  8. vue项目移植tinymce踩坑

    转载:https://segmentfault.com/a/1190000012791569?utm_source=tag-newest 2019-2-18 貌似这篇文章帮了大家一些小忙最近tinym ...

  9. vue踩坑记

    vue踩坑记 易错点 语法好难啊qwq 不要把'data'写成'date' 在v-html/v-bind中使用vue变量时不需要加变量名 在非vue事件中使用vue中变量时需要加变量名 正确 < ...

  10. vue踩坑(二):跨域以及携带cookie

    最近后台需求要在请求的时候传cooki给后台,正常情况下拿到cookie后存在cookie里,同域名下是会自己带到请求头里的,但是因为要在本地调试,那么问题就来了,localhost:8080下面的c ...

随机推荐

  1. Java基础Day4-Java方法

    一.方法的定义 Java的方法类似于其它语言的函数,是一段用来完成特定功能的代码片段. 方法包括一个方法头和一个方法体. 修饰符 返回值类型 方法名(参数类型 参数名){      方法体      ...

  2. 4组-Beta冲刺-1/5

    一.基本情况 队名:摸鲨鱼小队 组长博客:https://www.cnblogs.com/smallgrape/p/15590583.html github链接:https://github.com/ ...

  3. vue创建项目的命令

    一.首先下载node环境 二.全局安装vue-cli cnpm i -g @vue/cli 这里一定要注意是vue/cli,而不是vue-cli 三.新建文件夹,打开cmd命令 1.vue creat ...

  4. PTA1004 成绩排名 (20 分)

    PTA1004 成绩排名 读入 n(>0)名学生的姓名.学号.成绩,分别输出成绩最高和成绩最低学生的姓名和学号. 输入格式: 每个测试输入包含 1 个测试用例,格式为 第 1 行:正整数 n 第 ...

  5. vue echarts 多个图表自适应

    <template> <div :id="id" :style="{width: `${width}`, height: `${height}`}&qu ...

  6. 第五章 散列表(哈希表)(hash表)

    散列表 特点 键和值一一对应 可以快速找到对应值,不需要进行查找 运用场景 模拟映射关系 防止重复 缓存记住数据,以免服务器再通过处理来生成它们 例如: 电话簿 用缓存记录url和对应的静态页面,存在 ...

  7. 在Mac上不常用但会用到的命令

    文章目录 1. chflags 2. rename 1. chflags chflags hidden filename 给文件添加隐藏属性 chflags nohidden filename 去掉文 ...

  8. ESP32 IDF V5.0 编译环境

    方法:环境搭建工具一键安装: 下载链接:https://dl.espressif.com/dl/esp-idf/ 可以选择离线安装方式和在线安装方式,建议:采用离线安装的方式 下载离线安装包之后点击安 ...

  9. 【桥接设计模式详解】Java/JS/Go/Python/TS不同语言实现

    [桥接设计模式详解]Java/JS/Go/Python/TS不同语言实现 简介 桥接模式(Bridge Pattern)是一种结构型设计模式,它将一个大类或一系列紧密相关的类拆分为抽象和实现两个独立的 ...

  10. Redis中 HyperLogLog数据类型使用总结

    转载请注明出处: 目录 1. HyperLogLog 的原理 2.使用步骤 3.实现请求ip去重的浏览量使用示例 4.Jedis客户端使用 5.Redission使用依赖 6.HyperLogLog ...