Vue实例简单方法介绍


Posted in Javascript onJanuary 20, 2017

 Vue实例的一些简单方法

<!DOCTYPE html>
<html>
<head>
 <title></title>
 <meta charset="utf-8">
 <script src="http://unpkg.com/vue/dist/vue.js"></script>
</head>
<body> 
 <div id="box">
  {{a}}
 </div>
 <script type="text/javascript">
  var vm = new Vue({
   el:'#box',
   data:{
    a:1,
   },
  });

  //vm就是实例对象
  console.log(vm.$el); //这里就是div元素
  vm.$el.style.background = 'red';
  console.log(vm.$data); 
  console.log(vm.$data.a); //'1' 
 </script>
</body>
</html>

Vue实例简单方法介绍

手动挂载

var vm = new Vue({
   data:{
    a:1,
   },
  });

  //手动挂载
  vm.$mount('#box');

或者下面的写法:

var vm = new Vue({
  data:{
  a:1,
  },
 }).$mount('#box');
var vm = new Vue({
  aa:11, //自定义属性
   data:{
    a:1,
   },
  }).$mount('#box');

 console.log(vm.$options.aa); //11

上面代码,自定义了属性aa,可以通过vm.$options获取。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js cookies 常见网页木马挂马代码 24小时只加载一次
Apr 13 Javascript
flexigrid 类似ext grid的JS表格代码
Jul 17 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
May 26 Javascript
jQuery中[attribute]选择器用法实例
Dec 31 Javascript
jQuery制作简洁的图片轮播效果
Apr 03 Javascript
js绘制购物车抛物线动画
Nov 18 Javascript
JavaScript字符串对象
Jan 14 Javascript
Angular2下使用pdf插件的方法详解
Apr 29 Javascript
浅谈Node异步编程的机制
Oct 18 Javascript
vue2.0之多页面的开发的示例
Jan 30 Javascript
小程序开发基础之view视图容器
Aug 21 Javascript
微信小程序前端promise封装代码实例
Aug 24 Javascript
微信小程序 Toast自定义实例详解
Jan 20 #Javascript
JavaScript判断浏览器及其版本信息
Jan 20 #Javascript
JS中传递参数的几种不同方法比较
Jan 20 #Javascript
JS出现失效的情况总结
Jan 20 #Javascript
JSON 数据详解及实例代码分析
Jan 20 #Javascript
Angular ui.bootstrap.pagination分页
Jan 20 #Javascript
bootstrap中的 form表单属性role=&quot;form&quot;的作用详解
Jan 20 #Javascript
You might like
PHP syntax error, unexpected $end 错误的一种原因及解决
2008/10/25 PHP
php学习笔记 面向对象中[接口]与[多态性]的应用
2011/06/16 PHP
php中数组首字符过滤功能代码
2012/07/31 PHP
一个多次搜索+多次传值的解决方案
2007/01/20 Javascript
jQuery 前的按键判断代码
2010/03/19 Javascript
jQuery 学习第六课 实现一个Ajax的TreeView
2010/05/17 Javascript
通过jquery的$.getJSON做一个跨域ajax请求试验
2011/05/03 Javascript
Array, Array Constructor, for in loop, typeof, instanceOf
2011/09/13 Javascript
可编辑下拉框的2种实现方式
2014/06/13 Javascript
JQuery自动触发事件的方法
2015/06/13 Javascript
JavaScript实现非常简单实用的下拉菜单效果
2015/08/27 Javascript
ECMA5数组的新增方法有哪些及forEach()模仿实现
2015/11/03 Javascript
Boostrap基础教程之JavaScript插件篇
2016/09/08 Javascript
JS实现微信摇一摇原理解析
2017/07/22 Javascript
jQuery实现简单的计时器功能实例分析
2017/08/29 jQuery
微信小程序自定义多选事件的实现代码
2018/05/17 Javascript
javascript实现自由编辑图片代码详解
2019/06/21 Javascript
JavaScript禁止右击保存图片,禁止拖拽图片的实现代码
2020/04/28 Javascript
[01:28:43]2014 DOTA2华西杯精英邀请赛5 24 DK VS CIS
2014/05/25 DOTA
[01:34]传奇从这开始 2016国际邀请赛中国区预选赛震撼开启
2016/06/26 DOTA
Python单元测试简单示例
2018/07/03 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python处理document文档保留原样式
2019/09/23 Python
Python求解正态分布置信区间教程
2019/11/20 Python
Django haystack实现全文搜索代码示例
2020/11/28 Python
python 对xml解析的示例
2021/02/27 Python
贝佳斯官方网站:Borghese
2020/05/08 全球购物
澳大利亚厨房和家用电器购物网站:Bing Lee
2021/01/11 全球购物
优秀求职自荐信怎样写
2013/12/18 职场文书
项目建议书模板
2014/05/12 职场文书
2014县委书记党的群众路线教育实践活动对照检查材料思想汇报
2014/09/22 职场文书
普通党员整改措施
2014/10/24 职场文书
力克胡哲观后感
2015/06/10 职场文书
干部理论学习心得体会
2016/01/21 职场文书
你对自己的信用报告有过了解吗?
2019/07/09 职场文书
创业计划书之川味火锅店
2019/09/02 职场文书