vue 自定义组件销毁

时间:2022-09-04 23:16:02
今天在开发电商vue前端项目时,用户每次登出再换其它用户登录时,页面显示的用户名和左则导航都还是上个用户的,刚开始以为是localStorage中没有清除全局数据,然后在用户点击退出系统时手动清除localStorage.clear();可是当换另一个用户登录时还是显示上一个用户的信息,具体如下图:
vue 自定义组件销毁vue 自定义组件销毁
vue 自定义组件销毁vue 自定义组件销毁
好,我们换另一个用户登录,如下图:
vue 自定义组件销毁vue 自定义组件销毁
vue 自定义组件销毁vue 自定义组件销毁
最后查询到的主要问题是,以上几个不同的地方都是引入的自定义组件,只要用户第一次登录系统后,组件加载一次到缓存中,不管以后其它用户登录多少次,还是以第一次内存中的为主。具体可以看下我的如下代码:
vue 自定义组件销毁vue 自定义组件销毁
以上就是加载的自定义组件,下次就不会再次走了,为什么呢,因为我们没有销毁阿。
上网上查了很多关于这方面的信息,要不太麻烦,要不就是看不懂,最好想到在离开home页面时销毁以上三个组件:具体代码如下:
 
vue 自定义组件销毁vue 自定义组件销毁
 
这样就解决了我们刚才遇到的问题,这个问题耽误了我半天的工作量,只能加班了。

vue 自定义组件销毁的更多相关文章

  1. vue自定义组件(vue.use(),install)+全局组件+局部组件

    相信大家都用过element-ui.mintui.iview等诸如此类的组件库,具体用法请参考:https://www.cnblogs.com/wangtong111/p/11522520.html ...

  2. Vue自定义组件实现v-model指令

    Tips: 本文所描述的Vue均默认是Vue2版本 在我们初次接触Vue的时候,一定会了解到一个语法糖,那就是v-model指令,它带给我们的第一印象就是它可以实现双向绑定 那么,什么是双向绑定?通俗 ...

  3. [转] vue自定义组件(通过Vue.use()来使用)即install的使用

    在vue项目中,我们可以自定义组件,像element-ui一样使用Vue.use()方法来使用,具体实现方法: 1.首先新建一个Cmponent.vue文件 // Cmponent.vue<te ...

  4. Vue自定义组件插入值

    我们自定义组件的时候有时候需要往组件里面插一些内容: //定义一个组件test,插值内容用slog来代替 export default { name: 'test', template:` <d ...

  5. VUE 自定义组件之间的相互通信

    一.自定义组件 1.全局自定义组件 我们在var vm = new Vue({});的上面并列写上Vue.component('自定义组件名',{组件对象});来完成全局自定义组件的声明.示例代码如下 ...

  6. vue自定义组件并使用

    以下是使用自己写的一个简单的文件上传框为例 1.自定义组件结构(一个js文件,一个vue文件),最好单独放一个文件 2.upload.vue 内容 其中,action是父组件传递给子组件的参数,使用p ...

  7. vue自定义组件中的v-model简单解释

    在使用iview框架的时候,经常会看到组件用v-model双向绑定数据,与传统步骤父组件通过props传值子组件,子组件发送$emit来修改值相比,这种方式避免操作子组件的同时再操作父组件,显得子组件 ...

  8. 8、VUE自定义组件

    1.为什么要使用自定义组件? 自定义组件是用来封装复杂的内容,提高可重用性,比如封装复杂的表格组件.日历组件.图片轮播组件等. 2.自定义组件 2.1. 全局组件 全局组件是每个Vue对象都能使用的组 ...

  9. Vue自定义组件以及组件通信的几种方式

    本帖子来源:小贤笔记 功能 组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它 ...

随机推荐

  1. &lbrack;SQL&rsqb; SQL 基础知识梳理(一)- 数据库与 SQL

    SQL 基础知识梳理(一)- 数据库与 SQL [博主]反骨仔 [原文地址]http://www.cnblogs.com/liqingwen/p/5902856.html 目录 What's 数据库 ...

  2. JQuery this 和 &dollar;&lpar;this&rpar; 详解

    this  this 在面向对象语言中,指代调用上下文对象,在js中,也是一模一样的概念,所以不管这个this出现在什么地方,只要追踪到当前调用对象是什么,那么this是什么也就一目了然了. 先看一个 ...

  3. 我用的一些Node&period;js开发工具、开发包、框架等总结

    开发工具 1.WebStorm,毫无疑问非他莫属,跨平台,强大的代码提示,支持Nodejs调试,此外还支持vi编辑模式,这点我很喜欢. 2.做些小型项目用Sublime Text. 3.Browser ...

  4. eclipsecdt添加自动补全功能

    自动代码补全完全是一个改善生活质量的功能呀!cdt拥有自动代码补全功能,只是我们没有打开而已 1. 绑定快捷方式 1. windows -> preferences ->general-& ...

  5. IZ65534&colon; &&num;39&semi;JAVA&period;LANG&period;CLASSFORMATERROR&&num;39&semi; ERROR FOR A VALID IDENTIFIER

    PAR status Closed as program error. Error description Error Message: The java class could not be loa ...

  6. DevExpress gridview下拉框的再次研究

    原文:DevExpress gridview下拉框的再次研究 前几天写了一篇关于研究DevExpress gridview下拉框的随笔(DevExpress gridview下拉框repository ...

  7. Oracle数据库时间类型悬疑案

    这次遇到的问题小Alan其实一年半前做证券行业项目就已经遇到过,但是一直没有去思考是什么原因导致的这样的悬疑案,悬疑案是什么呢?其实很简单,我想有不少童鞋都有用到Oracle数据库,情形是这样子的,这 ...

  8. c或c&plus;&plus;利用scanf无限输入并进行简单操作如比大小等

    #include <iostream> using namespace std; int main() { ; ) //scanf返回值为int类型表示成功输入的数据数量个数 { if(n ...

  9. 单源最短路——SPFA算法(Bellman-Ford算法队列优化)

    spfa的算法思想(动态逼近法):     设立一个先进先出的队列q用来保存待优化的结点,优化时每次取出队首结点u,并且用u点当前的最短路径估计值对离开u点所指向的结点v进行松弛操作,如果v点的最短路 ...

  10. &lbrack;hdu 2586&rsqb;lca模板题(在线&plus;离线两种版本)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2586 在线版本: 在线方法的思路很简单,就是倍增.一遍dfs得到每个节点的父亲,以及每个点的深度.然后 ...