在Vue中的load或ready的加载时机

1、我们来插入一段代码来分析：

Js代码如下

  <script type="text/javascript">

            var app = new Vue({

                el: '#app',

                data: {},

                mounted: function () {

                    var interval = 2000;

                    Resize();

                    Map();

                    setInterval("Map()", interval);

                    dateTimer();

                    setInterval("dateTimer()", 1000);

                    $(window).resize(function () {

                        location.reload();

                    });

                }

            })

        </script>

　　对代码的解读，mounted函数为页面加载完毕执行的函数。添加监视等工作。

html代码：

<body class="container-fluid" >

    <div id="app">

    </div>

</body>

我们在body下的顶层设定一个id为app的div，而且必须在body下声明一个顶级DIV元素或者其他的根元素。

在Vue中的load或ready的加载时机的更多相关文章

  1. 在vue中使用Echarts画曲线图(异步加载数据)

    现实的工作中, 数据不可能写死的,所有的数据都应该通过发送请求进行获取. 所以本项目的需求是请求服务器获得二维数组,并生成曲线图.曲线图的横纵坐标均从获得的数据中取得. Echarts官方文档: ht ...

  2. 在vue中运用mt-loadmore 实现上拉加载，下拉刷新（完整源码）

    <template> <div class="serverList"> <ul class="scrollModeBox" :st ...

  3. 在vue中运用mt-loadmore 实现上拉加载，下拉刷新

    元旦了,给手残党直接复制的机会,代码如下: 1. :style="{'-webkit-overflow-scrolling': scrollMode}" 最外层div设置,以便兼容 ...

  4. 使用jquery的load方法设计动态加载，并解决被加载页面JavaScript失效问题

    一.问题分析 对于后台系统,相比大家都有所印象,知道其中的布局结构,如图: 在这种布局中我们需要将header,sidebar,footer分开,而且对于中间部分的content内容需要动态变化,即根 ...

  5. 使用jquery的load方法设计动态加载，并解决浏览器前进、后退、刷新等问题

    继上一篇 使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题 解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后 ...

  6. vue+elementUI+axios实现的全局loading加载动画

    在项目中,很多时候都需要loading加载动画来缓解用户的焦虑等待,比如说,我打开了一个页面,而这个页面有很多接口请求,但浏览器的请求并发数就那么几个,再加上如果网速不行的话,那么这时候,用户很可能就 ...

  7. Vue(基础七）_webpack(webpack异步加载原理)

    ---恢复内容开始--- 一.前言 1.webpack异步加载原理’                                           2.webpack.ensure原理     ...

  8. vue（组件、路由）懒加载

    const Login = resolve => require(['@/components/Login'], resolve) //就不用import了 Vue.use(Router) le ...

  9. WPF中，怎样将XAML代码加载为相应的对象？

    原文:WPF中,怎样将XAML代码加载为相应的对象? 在前面"在WPF中,如何得到任何Object对象的XAML代码?"一文中,我介绍了使用System.Windows.Marku ...

随机推荐

  1. bzoj2049 线段树 + 可撤销并查集

    https://www.lydsy.com/JudgeOnline/problem.php?id=2049 线段树真神奇 题意:给出一波操作,拆边加边以及询问两点是否联通. 听说常规方法是在线LCT, ...

  2. 设计模式---数据结构模式之组合模式（Composite）

    前提:数据结构模式 常常有一些组建在内部具有特定的数据结构,如果让客户程序依赖这些特定的数据结构,将极大的破坏组件的复用.这时候,将这些数据结构封装在内部,在外部提供统一的接口,来实现与特定数据结构无 ...

  3. 【.Net平台下插件开发】-MEF与MAF初步调研

    背景   Team希望开发一个插件的平台去让某搜索引擎变得更好.主要用于采集一些不满意信息(DSAT)给Dev.这些信息会由不同的team提供不同的 tool分析.有的提供仅仅是一个website,有 ...

  4. 040、Docker managed volume（2019-03-01 周五）

    参考https://www.cnblogs.com/CloudMan6/p/7152775.html   docker managed volume 与bind mount 在使用上最大的区别是不需要 ...

  5. 自学python 4.

    1.li = ["alex","tom","mike","god","merffy"](1)a = ...

  6. 使用yield和send实现简单的协程函数

    使用yield和send实现协程 协程的本质是在一个线程里实现多个任务之间的来回切换,我们使用yield和send可以实现简单的协程 def pro(): print(1) n = yield &qu ...

  7. python模块之自定义模块

    模块概述 到此之前,我们都是在一个py文件里操作,接下来,我们学习模块的内容,可以从其他文件引入内容(如函数等) 1. 什么是模块 一个py文件就是一个模块,模块是一些相似功能的集合体 2. 为什么要 ...

  8. 细说tomcat之集群session共享方案

    1. Tomcat Cluster官网:http://tomcat.apache.org/tomcat-7.0-doc/cluster-howto.htmlTomcat原生支持的集群方案,通过组播消息 ...

  9. 【bzoj 4764】弹飞大爷

    Description 自从WC退役以来,大爷是越来越懒惰了.为了帮助他活动筋骨,也是受到了弹飞绵羊一题的启发,机房的小伙伴们决定齐心合力构造一个下面这样的序列.这个序列共有N项,每项都代表了一个小伙 ...

  10. tensorflow--logistic regression

    import tensorflow as tf from tensorflow.examples.tutorials.mnist import input_data mnist=input_data. ...