<script>
  import { mapState } from "vuex";
  export default {
    

    data() {
        return {
          PlayList: "" 
        };
     },
    

    computed: {
        ...mapState(["Playname"]) //获取vuex中某一条数据
      },
    methods: {
      

      http() {
            let That = this;
            this.axios
              .get("http:请求的接口=" +this.PlayList)
              .then(res => {
                var data = res.data;
               That.danqu = data;
               console.log(datadata);
              });
     
        }
 
    },

     

    mounted() {
        this.PlayList = this.Playname;  //把传过来的值每次先存一下
        this.http();//先调用一次http函数
      },
    activated() {
        if (this.PlayList != this.Vuex获取过来的值) { //判断一下如果获取到的值和上一次获取到的一样就不执行if 如果不一样就执行if
            this.http(); //调用ajax 
            this.PlayList = this.Playname; //把传过来的值给 this.Playname
        }
     }
 
 
  }
</script>

Vue中的组件及缓存 keep-alive的更多相关文章

  1. Vue 中的组件

    VUE中的组件 一个自定义的标签,vue就会把他看成一个组件,vue可以给这些标签赋予一定意义:一个页面就是一个组件 好处: 1.提高开发效率 2.方便重复使用 3.便于协同开发 4.更容易被管理和维 ...

  2. Vue中keep-alive组件的理解

    对keep-alive组件的理解 当在组件之间切换的时候,有时会想保持这些组件的状态,以避免反复重渲染导致的性能等问题,使用<keep-alive>包裹动态组件时,会缓存不活动的组件实例, ...

  3. vue中自定义组件(插件)

    vue中自定义组件(插件) 原创 2017年01月04日 22:46:43 标签: 插件 在vue项目中,可以自定义组件像vue-resource一样使用Vue.use()方法来使用,具体实现方法: ...

  4. Vue中父子组件执行的先后顺序

    Vera   Vue中父子组件执行的先后顺序探讨(转载) 前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看 ...

  5. Vue中父子组件执行的先后顺序探讨

    前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看法. 问题如下:请问下图中父子组件执行的先后顺序? 首先, ...

  6. Vue中父组件向子组件传值

    Vue中父组件向子组件传值 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  7. Vue 中数据流组件

    好久不见呀,这两年写了很多很多东西,也学到很多很多东西,没有时常分享是因为大多都是我独自思考.明年我想出去与更多的大神交流,再修筑自己构建的内容. 有时候我会想:我们遇到的问题,碰到的界限,是别人给的 ...

  8. 简述vue中父子组件是怎样相互传递值的(基础向)

    前言 首先,你需要知道vue中父组件和子组件分别指的是什么?   父组件:vue的根实例——用new Vue()构造函数创建的vue实例(实例会有一个挂载点,挂载点里的所有内容可理解为父组件的内容) ...

  9. 解决vue中element组件样式修改无效

    vue中element组件样式修改无效 <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写st ...

随机推荐

  1. 搜索引擎算法研究专题七:Hilltop算法

    搜索引擎算法研究专题七:Hilltop算法 2017年12月19日 ⁄ 搜索技术 ⁄ 共 1256字 ⁄ 字号 小 中 大 ⁄ 评论关闭   HillTop也是搜索引擎结果排序的专利,是Google工 ...

  2. leetcode 134 加油站问题

    leetcode 134 解析 在一条环路上有 N 个加油站,其中第 i 个加油站有汽油 gas[i] 升. 你有一辆油箱容量无限的的汽车,从第 i 个加油站开往第 i+1 个加油站需要消耗汽油 co ...

  3. leetcode 107.Binary Tree Level Order Traversal II 二叉树的层次遍历 II

    相似题目: 102 103 107 /** * Definition for a binary tree node. * struct TreeNode { * int val; * TreeNode ...

  4. JS获取select被选中的option的值

    一:JavaScript原生的方法 1:拿到select对象: var myselect=document.getElementById(“test”); 2:拿到选中项的索引:var index=m ...

  5. 【Python】—— 获取函数内部变量名称

    原文出处: https://blog.csdn.net/maixiaochai/article/details/88693507 关键语句: func_vars = func.__code__.co_ ...

  6. 测开之路一百五十五:jquery-validation前台数据验证

    前面做的wtform验证是服务器端的验证,需要把数据传输到服务器,服务器验证后再吧结果传输到前端,网络慢的时候,用户体验不好,所以需要前端验证,且后端验证不能少 传统的js或者jquery如果要验证信 ...

  7. springboot上传文件过大,全局异常捕获,客户端没有返回值

    最近在项目里进行全局异常处理时,上传文件超过配置大小,异常被捕获,但是接口直接报500错误,且没有任何返回值. 从后台报错日志来看,异常已经被全局异常处理捕获到了,并且也已经完成响应,为什么前端看不到 ...

  8. docker nginx ssl

    docker run -d -p 80:80 -p 443:443 -v $(pwd)/conf/conf.d:/etc/nginx/conf.d -v $(pwd)/cert:/etc/nginx/ ...

  9. TCP/IP笔记——UDP

    OSI模型中最下面的两层用来解决两个硬件设备在物理上的通信问题(如规定怎么将电平信号转换为数字信号),相对应的TCP/IP模型中,这部分代表将会将机器封装为一个MAC地址来实现通讯.网络层是关于,具体 ...

  10. 实用网站推荐——office模板(PPT)

    今天给大家分享一批Office的模板网站! office模板比较多的是PPT模板,做PPT是一件非常痛苦的事,自己做的要么太丑,要么搭配太单一,所以今天给大家分享一批网站,再也不用愁做PPT了. wo ...