在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. Linux系统上安装nodejs

    1 官网下载地址:https://nodejs.org/en/download/ 2 下载的node-v10.15.2-linux-x64.tar.xz  上传到Linux系统后  因为安装的是纯净版 ...

  2. 2018acm-icpc徐州站后记

    大概是我所有比赛里面打的最自闭的比赛了,真的很不想写这篇比赛的后记. 记得我刚学习acm的时候,觉得如果每一场比赛都能拿一块铜牌就好了,只要不铁都是很开心的. 但是没想到真正拿铜会这么难受.可能是因为 ...

  3. springboot定时任务处理

    定时任务是一种很常见的应用场景,springboot中的定时任务完全用的spring的那一套,用起来比较简单,需要注意的是线程池配置的那一块 使用 @EnableScheduling 注解就可以开启定 ...

  4. beego 实现API自动化文档

    安装beego和bee工具 1.beego安装 go get -u github.com/astaxie/beego 2.安装bee工具 go get -u github.com/beego/bee ...

  5. python (大文件下载及进度条展示) 验证客户端链接的合法性,socketserver

    ##########总结########### 文件校验加进度条显示 ####server import os import json import socket import struct impo ...

  6. Mysql分页优化

    数据表 collect ( id, title ,info ,vtype) 就这4个字段,其中 title 用定长,info 用text, id 是主键,vtype是tinyint,vtype是索引. ...

  7. 微信小程序,错误{"errMsg":"request:fail 小程序要求的 TLS 版本必须大于等于 1.2"}

    解决方法一: 开发环境,项目--->勾选不校验即可 解决办法二: 在 PowerShell中运行以下内容, 然后重启服务器 # Enables TLS R2 and Windows # Thes ...

  8. vue常用的路由对象

    官网上解释:一个路由对象表示当前激活的路由的状态信息 路由对象,在组件内即this.$route,存着一些与路由相关的信息,当路由切换时,路由对象会被更新 //如果要在刷新页面时候通过路由的信息来操作 ...

  9. 044、vloume声明周期管理(2019-03-07 周四)

    参考https://www.cnblogs.com/CloudMan6/p/7214828.html   如果Data Volume 中存放的是重要的应用数据,如何管理volume对应用至关重要.   ...

  10. [Android] Android Butterknife 8.8.1 在 Activity 和 Fragment 、 Adapter 中的使用

    ButterKnife是一个专注于Android系统的View注入框架,以前总是要写很多findViewById来找到View对象,有了ButterKnife可以很轻松的省去这些步骤.是大神JakeW ...