<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. Elasticsearch Java Rest Client API 整理总结 (一)

    http://www.likecs.com/default/index/show?id=39549

  2. hadoop stop-dfs.sh 无法停止 namenode datanode

    原因: HADOOP_PID_DIR 默认为 /tmp 目录,如果长期不访问/tmp/目录下的文件,文件会被自动清理,因此 stop-dfs.sh 无法根据 pid 停止 namenode, data ...

  3. np.random.shuffle(x)与np.random.permutation(x)

    来自:https://blog.csdn.net/brucewong0516/article/details/79012233 将数组打乱随机排列 两种方法: np.random.shuffle(x) ...

  4. 【IOS打包】ARCHIVE FAILED:Command CodeSign failed with a nonzero exit code

    [问题] [解决办法] 用xcode打开项目 command + k 重启电脑 参照:xcode打包报错command codesign failed with a nonzero exit code ...

  5. css随笔记(持续更新)

    /*DIV鼠标穿透*/ div{pointer-events:none;} /*清除IE11默认×*/ input::-ms-clear{display:none;} 使用伪类写边框部分三角 右上角三 ...

  6. 应用安全 - CMS - vBulletin漏洞汇总

    SSV-15384 Date: 2004.11 漏洞类别: SQL 注入 SSV-15476 Date: 2005.2 漏洞类别: RCE SSV-15482 Date: 2005.2 类型: RCE ...

  7. 第四周预习作业and第五周作业

    第四周预习作业 统计一行文本的单词个数 本题目要求编写程序统计一行字符中单词的个数.所谓"单词"是指连续不含空格的字符串,各单词之间用空格分隔,空格数可以是多个. 输入格式: 输入 ...

  8. SpringBoot项目启动时执行初始化操作

    SpringBooot中的CommandLineRunner接口会在所有Spring Beans初始化之后,SpringApplication.run()之前执行. 1.添加pom引用 <?xm ...

  9. Java——HashMap底层源码分析

    1.简介 HashMap 根据键的 hashCode 值存储数据,大多数情况下可以直接定位到它的值,因而具有很快的访问速度,但遍历顺序却是不确定的. HashMap 最多只允许一条记录的key为 nu ...

  10. Spark-Core RDD转换算子-双Value型交互

    1.union(otherDataSet) 作用:求并集. 对源 RDD 和参数 RDD 求并集后返回一个新的 RDD scala> val rdd1 = sc.parallelize(1 to ...