实例方法-扩展器-生命zhou

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>example 实例方法</title><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript" src="js/jquery-3.2.1.js"></script>
</head>
<body><div id="app"></div><button onclick="destroy()">销毁</button><button onclick="reload()">刷新</button> <button onclick="tick()">数据更改</button>
</body>
<script type="text/javascript">var cai=Vue.extend({  //   扩展器
        template:`<p>{{message}}</p>`,  //模版
        data:function(){   //数据return {message:'你好我蔡蔡'}},mounted:function(){  //挂载运行次方法
            console.log('mounted 被创建！')},destroyed:function(){  //销毁后 调用次方法  生命周期
            console.log('destroyed  销毁之后')},updated:function(){console.log('updated更新后')}})var vm=new cai().$mount("#app");  //挂载function destroy(){  //  js方法函数
        vm.$destroy();    //销毁
    }function reload(){vm.$forceUpdate();  //更新
    }function tick(){vm.message="修改后的内容";vm.$nextTick(function(){  //数据修改方法  在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。
            console.log('message更改完成后我被调用了');})}</script>
</html>

转载于:https://www.cnblogs.com/jinsuo/p/8068041.html

实例方法-扩展器-生命zhou相关推荐

深入浅出Vue.js阅读——整体流程——实例方法与全局API的实现原理
深入浅出Vue.js阅读--整体流程--实例方法与全局API的实现原理 1. 数据相关的实例方法 2. 事件相关的实例方法 1. vm.$on 2. vm.$off 3. vm.$once 4. vm ...
夺旗赛 CTF 六大方向基础工具简介
一.MISC方向杂项往往是不能被归到其他类别里的题目,所以什么样的题都有,工具也很杂. 主要的分类有: 1.视频音频图片类 Stegsolve.jar 一款图像隐写工具,支持使用不同方式解除图像隐写 ...
Vue基础进阶之实例方法--生命周期
在上一篇博客中我们知道生命周期的方法: 生命周期: vm.$mount:手动挂载Vue实例: vm.$destroy:销毁Vue实例,清理数据绑定,移除事件监听: vm.$nextTick:将方法中的 ...
03Spring_bean的创建和作用域以及生命周期
bean的三种创建方式: 方式一: 使用类构造器实例化对象  <bean id="bean1" cla ...
【Java12】tomcatservlet（nginx，web.xml，生命周期，适配器优化），requestresponse（请求转发，登陆案例（1），重定向，文件下载）
文章目录 1.nginx的conf文件:以前网络编程中B/S架构中服务器是用socket写,用文件输入流读一个文件,读到后socket通过outputstream写出去,这些过程有了nginx后再也不 ...
callback用法 js vue_Vue.js 实例方法
Vue 实例方法实例属性 1.组件树访问 1-1.vm.$parent 用来访问当前组件实例的父实例,如果当前实例有的话 1-2.vm.$root 当前组件树的根 Vue 实例.如果当前实例没有父实 ...
vue实例以及生命周期
1.Vue实例API 1.构造器(实例化) var vm = new Vue({ //选项 |-------DOM(3) | |-------el (提供一个在页面上已存在的 DOM 元素作为 Vue ...
spring bean的创建，生命周期
1. 初探spring 什么是spring Spirng 是分层的Java se/ee应用full-stack(web层mvc dao层jdbc模板业务事务管理)轻量级开源框架,以IoC(inver ...
【转】Asp.net的生命周期之应用程序生命周期
参考:http://msdn.microsoft.com/zh-cn/library/ms178473(v=vs.100).aspx 参考:http://www.cnblogs.com/JimmyZh ...

实例方法-扩展器-生命zhou

实例方法-扩展器-生命zhou相关推荐

最新文章

热门文章