zoukankan      html  css  js  c++  java
  • 钩子函数mounted:

    1.钩子函数 
    钩子函数是Windows消息处理机制的一部分,通过设置“钩子”,应用程序可以在系统级对所有消息、事件进行过滤,访问在正常情况下无法访问的消息。钩子的本质是一段用以处理系统消息的程序,通过系统调用,把它挂入系统。(百度百科)

    2.相对于前端来讲 
    对于前端来说,钩子函数就是指再所有函数执行前,我先执行了的函数,即 钩住 我感兴趣的函数,只要它执行,我就先执行。

    3.vue中的mounted 
    在这发起后端请求,拿回数据,配合路由钩子做一些事情 
    类型: Function 
    详细: 
    el被新创建的 vm.elrootmountedvm.el替换,并挂载到实例上去之后调用该钩子。如果root实例挂载了一个文档内元素,当mounted被调用时vm.el 也在文档内 
    该钩子在服务器端渲染期间不被调用。

    4.代码实例

    new Vue({
      el: '#app',
      data: {
        totalMoney: 0,
        productList: []
      },
      filters: {
      },
      mounted: function() {
      //这个是钩子函数
      //如果cartView函数要执行,必须先执行钩子函数
      //这个钩子函数完成了对cratView函数的调用
      //应该注意的是,使用mounted 并不能保证钩子函数中的 this.$el 在 document 中。为此还应该引入             Vue.nextTick/vm.$nextTick
           this.$nextTick(function () {
              this.cartView() 
          })
       })
      },
      methods: {
      //这个是要执行的函数
          cartView: function() {
            var _this = this;
            this.$http.get("data/cartData.json", {"id": 123}).then(function(res) {
              _this.productList = res.body.result.list;
              _this.totalMoney =  res.body.result.totalMoney;
            });
          }
          }
        }
    });
    致力于前端技术学习与分享,会及时更新博客。
  • 相关阅读:
    【宗萨仁波切】研究佛教即是研究自己,而研究自己即是发现无我
    【佩玛.丘卓】在当下那一刻觉醒...
    佩玛·丘卓:人生基本的事实
    佩玛.丘卓的生活智慧——【空船】
    佩玛·丘卓 | 宽恕自己,重新开始
    佩玛·丘卓:修炼平等心
    佩玛•丘卓 :我们需要的皆已具足
    【佩玛丘卓】喂养好狼
    佩玛.丘卓:为事情如实的面目而喜悦
    佩玛·丘卓:精神勇士的口诀
  • 原文地址:https://www.cnblogs.com/caoxueying2018/p/9636202.html
Copyright © 2011-2022 走看看