一、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. Java集合框架Collection(1)ArrayList的三种遍历方法

    ArrayList是java最重要的数据结构之一,日常工作中经常用到的就是ArrayList的遍历,经过总结,发现大致有三种,上代码: package com.company; import java ...

  2. HTML连载7-表单练习

    昨天因为晚上有事情,未更新,但是今天中午发也不晚,因为是同一天只是时间早晚而已,因此今日傍晚还将更新一次,废话不多说. 1.表单的综合练习,我们要创建一个综合的注册页面.运用到我们前面所学的所有知识. ...

  3. 关于Git 的管理凭据操作

    1.桌面-->2.我的电脑-->3.右击选择属性-->4.控制面板主页-->5.在用户账户和家庭安全下,选择添加或删除用户账户-->转到“主用户账户”页面-->6. ...

  4. 05 div的嵌套

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. JavaWeb入门_模仿天猫整站Tmall_JavaEE实践项目

    Tmall_JavaEE 技术栈 Servlet + Jsp + Tomcat , 是Java Web入门非常好的练手项目 效果展示: 模仿天猫前台 模仿天猫后台 项目简介 关联项目 github - ...

  6. Fiddler如何自动修改请求和响应包

    Charles的Map功能可以将某个请求进行重定向,用重定向的内容响应请求的内容.这个功能非常方便.在抓包过程当中,有时候为了调试方便,需要将线上的服务定位到内网.比如我们线上的服务器域名为 api. ...

  7. ECShop安装问题

    Ecshop安装过程中的的问题:cls_image::gd_version()和不支持JPEG 在安装Ecshop的时候,遇到两个问题: 1.Strict Standards: Non-static ...

  8. Linux下无法执行tree命令问题

    Linux下不能使用tree命令,是因为没有安装命令, 执行下面代码就行了 yum install tree -y

  9. ZooKeeper入门(二) Zookeeper选举

    1 背景 1.1 什么是leader选举 在zookeeper集群中,每个节点都会投票,如果某个节点获得超过半数以上的节点的投票,则该节点就是leader节点了 1.2 zookeeper集群选举le ...

  10. Codeforces 760B:Frodo and pillows(二分)

    http://codeforces.com/problemset/problem/760/B 题意:有n张床m个枕头,每张床可以有多个枕头,但是相邻的床的枕头数相差不能超过1,问第k张床最多能拥有的枕 ...