在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. cmd解压压缩包

    需要安装有winrar start winrar x C:\Users\systme\Desktop\xxx.rar c:\123

  2. 使用WinPcap（SharpPcap）实现ARP抓包以实现设备IP修改功能

    参考上一篇: 使用WinPcap(SharpPcap)实现ARP抓包以实现设备IP搜索功能 搜索出设备后,需要修改设备IP网关掩码等信息 继续采用ARP包 getBas类似之前的,根据用户电脑的网卡物 ...

  3. go实现Windows服务注册

    go实现Windows服务注册 1.nssm下载:http://nssm.cc/download 2.服务注册 nssm.exe install 服务名  程序 样例如下: .\nssm.exe in ...

  4. Linux CGroup

    catalog . 引言 . Cgroup安装配置 . Cgroup使用方式 . CGroup的子系统 1. 引言 我们已经讨论了Linux下命名空间(Namespace)的基本知识,详情请参阅另一篇 ...

  5. 网络编程基础【day10】：多线程效果演示（二）

    本节内容 1.引子 2.并发多线程效果演示 一.引子 我们说单核的cpu只能同时执行一个任务,但是给我们的一个幻觉是可以执行多个,因为cpu太快了.它是怎么实现的呢?就是上下文切换,它不是轮询着切换的 ...

  6. ruby select 方法，可用于先查询结果后，再次用条件限制

    1. 用于条件过滤 @works=DworkPro.all.order(:work_type) @work_pro=@works.select{ |x| x.job_type == 7} 2. sel ...

  7. Web前端框架与移动应用开发第七章

    1.练习1:焦点图切换 html: <!doctype html><html><head> <meta charset="utf-8" / ...

  8. HDU 1026(迷宫 BFS+打印)

    题意是要穿过一个迷宫并且将每一步打印出来. 用宽搜的方法找到路径,在 vis 中存一下方向,只是这题被看到的一种不太对的运算符重载坑了很久...... 代码如下: #include <bits/ ...

  9. MySQL学习笔记（三）数据优化

    第1章 数据库优化简介1-1 MySQL优化简介 第2章 SQL语句优化2-1 数据准备 2-2 MySQL慢查日志的开启方式 2-3 MySQL慢查日志分析工具之 mysqldumpslow www ...

  10. springBoot中实现自定义属性配置、实现异步调用、多环境配置

    springBoot中其他相关: 1:springBoot中自定义参数: 1-1.自定义属性配置: 在application.properties中除了可以修改默认配置,我们还可以在这配置自定义的属性 ...