在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. python自动化开发-[第十四天]-javascript(续)

    今日概要: 1.数据类型 2.函数function 3.BOM 4.DOM 1.运算符 算术运算符: + - * / % ++ -- 比较运算符: > >= < <= != = ...

  2. bzoj2434 fail树 + dfs序 + 树状数组

    https://www.lydsy.com/JudgeOnline/problem.php?id=2434 打字机上只有28个按键,分别印有26个小写英文字母和'B'.'P'两个字母.经阿狸研究发现, ...

  3. Docker记录-Docker部署记录

    1.Docker介绍 Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从Apache2.0协议开源. Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级.可移植的容器中,然后 ...

  4. C#多线程和异步（二）——Task和async/await详解

    一.什么是异步 同步和异步主要用于修饰方法.当一个方法被调用时,调用者需要等待该方法执行完毕并返回才能继续执行,我们称这个方法是同步方法:当一个方法被调用时立即返回,并获取一个线程执行该方法内部的业务 ...

  5. laravel 5.4 fopen(): Filename cannot be empty

    1.出错的报错信息(我在用laravel5.4文件上传时候出错的) laravel 5.4 fopen(): Filename cannot be empty 2.解决的方法 在php.ini中修改临 ...

  6. JMETER压力测试报错:JAVA.NET.BINDEXCEPTION: ADDRESS ALREADY IN USE: CONNECT

    最近在实现接口压力测试的时候遇到这样的一个问题 当线程数持续上升到一个点的时候,运行脚本的时候有很多报错,如图: java.net.BindException: Address already in ...

  7. MySQL忘记root密码的解决办法

    # 1.停掉MySQL进程 [root@standby ~]# /etc/init.d/mysqld stop Shutting down MySQL... SUCCESS! [root@standb ...

  8. Kettle系列:使用Kudu API插入数据到Kudu中

    本文详细介绍了在Kettle中使用 Kudu API将数据写入Kudu中, 从本文可以学习到:1. 如何编写一个简单的 Kettle 的 Used defined Java class.2. 如何读取 ...

  9. 使用js修改url地址参数

    该方法可以修改url的参数. 例如将 www.baidu.com 修改为 www.baidu.com?name=123 操作为: window.location.href = changeURLArg ...

  10. WMware虚拟机中连接ios真机

    虚拟机中能看到IOS真机,但MAC OS看不到,进行如下设置虚拟机设置->USB控制器->USB兼容性->选择2.0