一、vue生命周期简单介绍

var App={

  template:'',

  data(){

  },

  beforeCreated:function(){

    //不能操作数据,只是初始化了事件等。。

  },

  created:function(){

    //可以操作数据

  },

  beforeMount:function(){

    //new vue发生装载,替换<div id='app'></div>之前

  },

  mouonted:function(){

    //装载数据之后

  }

}

二、vue在组件的dom部分,任意的标签中写 ref='xxx'属性,在组件对象中就可以通过this.$refs.xxx的方式,获取到元素

三、希望vue渲染dom到页面后,执行的操作,比如让input获取焦点

  this.$nextTick(function(){

    //操作逻辑

  })

:git上有开发的项目作为例子,有兴趣的可以下载学习。源代码已上传git:Git地址,也可以扫码加入QQ交流群

                                                                                

vue教程(四)--其他实用用法补充的更多相关文章

  1. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

  2. 手把手教从零开始在GitHub上使用Hexo搭建博客教程(四)-使用Travis自动部署Hexo(2)

    前言 前面一篇文章介绍了Travis自动部署Hexo的常规使用教程,也是个人比较推荐的方法. 前文最后也提到了在Windows系统中可能会有一些小问题,为了在Windows系统中也可以实现使用Trav ...

  3. vue教程1-08 交互 get、post、jsonp

    vue教程1-08 交互 get.post.jsonp 一.如果vue想做交互,引入: vue-resouce 二.get方式 1.get获取一个普通文本数据: <!DOCTYPE html&g ...

  4. vue教程1-06 v-bind属性、class和style

    vue教程1-06 属性.class和style 一.属性 属性: v-bind:src="" width/height/title.... 简写: :src="&quo ...

  5. day 83 Vue学习四之过滤器、钩子函数、路由、全家桶等

    Vue学习四之过滤器.钩子函数.路由.全家桶等   本节目录 一 vue过滤器 二 生命周期的钩子函数 三 vue的全家桶 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 Vue的过滤 ...

  6. CRL快速开发框架系列教程四(删除数据)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  7. C#微信公众号开发系列教程四(接收普通消息)

    微信公众号开发系列教程一(调试环境部署) 微信公众号开发系列教程一(调试环境部署续:vs远程调试) C#微信公众号开发系列教程二(新手接入指南) C#微信公众号开发系列教程三(消息体签名及加解密) C ...

  8. 无废话ExtJs 入门教程四[表单:FormPanel]

    无废话ExtJs 入门教程四[表单:FormPanel] extjs技术交流,欢迎加群(201926085) 继上一节内容,我们在窗体里加了个表单.如下所示代码区的第28行位置,items:form. ...

  9. TFS(Team Foundation Server)敏捷使用教程(四):工作项跟踪(1)

    工作项跟踪(1) 可跟踪性是软件过程的重要能力,TFS主要是以工作项来实现过程的可跟踪性.曾有人问:"你们实际项目里的工作项是怎么样的?能不能让我们看看?"我也一直很好奇别的公司T ...

随机推荐

  1. Ubuntu14.04 静态编译安装Qt4.8.6

    ./configure -static -nomake demos -nomake examples -nomake tools -no-exceptions -prefix /usr/local/Q ...

  2. ZooKeeper+Dubbo+SpringBoot 微服务Demo搭建

    1. 首先创建springBoot项目,springBoot是一堆组件的集合,在pom文件中对需要的组件进行配置.生成如下目录结构 创建test项目,同步在test创建dubbo-api,dubbo- ...

  3. CMake编译Widget UI Qt程序

    自从CMake被引入到KDE项目的编译系统中后,CMake的使用者日益增多,Qt也不例外,除了使用QMAKE编译Qt程序外,也可以使用CMake来编译Qt程序,并且CMake在使用上更灵活,特别是大型 ...

  4. DataVeryLite入门教程(一) 配置篇

    DataVeryLite 是基于.net 4.0的数据库持久化ORM框架. 目前支持的数据库有Sqlserver,Mysql,Oracle,Db2,PostgreSql,Sqlite和Access. ...

  5. TopFreeTheme精选免费模板【20130626】

    有一段时间没有发布的模板了,相信很多喜欢新模板的朋友有点焦急了!还好,今天我今天整理了13个最新的模板,主要是WordPress的,另外3个是关于Joomla的模板,他们分别是游戏主题.俱乐部主题以及 ...

  6. python requests模块session的使用建议及整个会话中的所有cookie的方法

    话不多说,直接上代码 测试代码 服务端 下面是用flask做的一个服务端,用来设置cookie以及打印请求时的请求头 # -*- coding: utf-8 -*- from flask import ...

  7. .NET中生成水印更好的方法

    .NET中生成水印更好的方法 为了保护知识产权,防止资源被盗用,水印在博客.网店等场景中非常常见. 本文首先演示了基于System.Drawing.Image做正常操作.然后基于Direct2D/WI ...

  8. org.springframework.beans.factory.BeanCreationException: Could not autowire field org.springframework.beans.factory.CannotLoadBeanClassException: Error loading class [com.xxxx.service.sys.impl.ProcEn

    七月 01, 2019 4:34:20 下午 org.apache.catalina.core.StandardContext listenerStart .....org.springframewo ...

  9. Java NIO 学习笔记(四)----文件通道和网络通道

    目录: Java NIO 学习笔记(一)----概述,Channel/Buffer Java NIO 学习笔记(二)----聚集和分散,通道到通道 Java NIO 学习笔记(三)----Select ...

  10. vscode+vagrant+xdebug调试

    配置: { "name": "Listen for XDebug", "type": "php", "requ ...