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 event使用方法详解
Apr 28 Javascript
window.location.hash 属性使用说明
Mar 20 Javascript
javaScript 页面自动加载事件详解
Feb 10 Javascript
利用jquery写的左右轮播图特效
Feb 12 Javascript
12行javascript代码绘制一个八卦图
Apr 02 Javascript
JavaScript基于ajax编辑信息用法实例
Jul 15 Javascript
JavaScript代码轻松实现网页内容禁止复制(代码简单)
Oct 23 Javascript
jQuery模拟360浏览器切屏效果幻灯片(附demo源码下载)
Jan 29 Javascript
微信小程序实现实时圆形进度条的方法示例
Feb 24 Javascript
vuejs前后端数据交互之从后端请求数据的实例
Aug 11 Javascript
JS使用队列对数组排列,基数排序算法示例
Mar 02 Javascript
微信小程序wepy框架学习和使用心得详解
May 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
PHP5中虚函数的实现方法分享
2011/04/20 PHP
linux环境apache多端口配置虚拟主机的方法深入介绍
2013/06/09 PHP
php+html5实现无刷新图片上传教程
2016/01/22 PHP
php实现留言板功能(会话控制)
2017/05/23 PHP
多个Laravel项目如何共用migrations详解
2018/09/25 PHP
script不刷新页面的联动前后代码
2013/09/18 Javascript
几种延迟加载JS代码的方法加快网页的访问速度
2013/10/12 Javascript
js 操作select与option(示例讲解)
2013/12/20 Javascript
jquery队列函数用法实例
2014/12/16 Javascript
Vue.js每天必学之过滤器与自定义过滤器
2016/09/07 Javascript
微信小程序自动客服功能
2017/11/02 Javascript
angularjs实现时间轴效果的示例代码
2017/11/29 Javascript
vue+springboot前后端分离实现单点登录跨域问题解决方法
2018/01/30 Javascript
js如何找出字符串中的最长回文串
2018/06/04 Javascript
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
Angular动画实现的2种方式以及添加购物车动画实例代码
2018/08/09 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
2018/08/31 Javascript
React学习之受控组件与数据共享实例分析
2020/01/06 Javascript
JavaScript仿京东轮播图效果
2021/02/25 Javascript
[49:02]KG vs Infamous 2019国际邀请赛淘汰赛 败者组BO1 8.20.mp4
2020/07/19 DOTA
打印出python 当前全局变量和入口参数的所有属性
2009/07/01 Python
Python基于twisted实现简单的web服务器
2014/09/29 Python
python3简单实现微信爬虫
2015/04/09 Python
Python中的字符串查找操作方法总结
2016/06/27 Python
Python爬虫天气预报实例详解(小白入门)
2018/01/24 Python
记一次python 内存泄漏问题及解决过程
2018/11/29 Python
python中使用 xlwt 操作excel的常见方法与问题
2019/01/13 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
骆驼官方商城:CAMEL
2016/11/22 全球购物
瑞典快乐袜子:Happy Socks
2018/02/16 全球购物
如何进行Linux分区优化
2016/09/13 面试题
2014年学校体育工作总结
2014/12/08 职场文书
教师节联欢会主持词
2015/07/04 职场文书
OpenCV-Python实现人脸磨皮算法
2021/06/07 Python
Python函数中apply、map、applymap的区别
2021/11/27 Python
MySQL查询日期时间
2022/05/15 MySQL