vue(4)

原创 2017年01月03日 15:49:23

我们知道,在Vue里面,需要实例化一个vue对象,那么vue有哪些方法呢?我们平时常用的又有那些呢?第一个,经常用的就是$mount,一个就是$options。下面具体介绍下用法。

我们知道,vue中el的主要作用是为实例提供挂载元素。值可以是 CSS 选择符,或实际 HTML 元素,或返回 HTML 元素的函数。如果在初始化的时候没有给定el的值,那么实例就无法编译,这个时候,就需要$mount手动挂载元素。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue.js"></script>
</head>
<body>
    <div class="box">
        <span>{{msg}}</span>
    </div>
</body>
<script>
    var vm = new Vue({
//        el:'.box',
        data:{
            msg:'hello world'
        }
    })
    vm.$mount('.box');
</script>
</html>

在上面加粗的代码中,与el:'.box'的作用是一样的,当然我们也可以这么做:var vm=new Vue({}).$mount('.box')。

如果用户自定义了一些属性和方法,这个时候就需要$.options登场了。

<script>
    var vm = new Vue({
//        el:'.box',
        data:{
            msg:'hello world'
        },
        show:function () {
            alert(1);
        }
    })
    vm.$mount('.box');
    vm.$options.show();
</script>

如上图所示,我们自定义了一个show方法,这个时候,如果想访问这个show函数,就需要$options来访问。如果需要查看vm的状态,就可以使用$log。

版权声明:本文为博主原创文章,未经博主允许不得转载。

Vue.js 2 and Bootstrap 4 Web Development.pdf

  • 2017年12月13日 10:58
  • 3.49MB
  • 下载

Vue2.0进阶组件篇4 突如其来(时间倒计时组件)

接下来的时候我想关注于node.js等一系前端知识,但是这个时间倒计时组件真的很突如其来,就在昨天,因为公司需求,要做一个倒计时,ok那没有问题,对于倒计时来说,一点都不难,肯定大家都写过,但是基于v...

Vue.js 系列教程 4:Vuex

这是关于 JavaScript 框架 Vue.js 五个教程的第四部分。在这一部分,我们会学习使用 Vuex 进行状态管理。 这不是一个完整的指南,而是基础知识的概述,所以你可以了解 Vue.js 以...

Vue.js 学习(4) -- 计算属性和Watchers

上一节我们知道了,在大括号插值和v-bind指令中,我们可以使用表达式。但是,如果表达式的逻辑太多、或者使用次数很多的时候,会让代码难以维护,使用模版的代码反而不再简单和清晰。这种情况下,与其使用复杂...

VUE2.0 全套 demo 讲解 基础4(条件渲染)

三篇基础发布之后,收到最多的就是谢谢楼主,其次的就是错别字有点多,这篇我肯定写完之后读三遍,现在已经是夜里2点了,如果还有没有发现大家就容忍一下,这次我将要讲的是条件渲染,对于条件渲染我觉得思来思去真...

4、vue.js的使用

一、参考资料 https://segmentfault.com/q/1010000004296954 官网:http://cn.vuejs.org/examples/commits.html ...

曹可爱之最可爱-Vue.js入门(十)组件4

开篇:nothing。使用插槽分发内容在使用组件时,我们常常要像这样组合它们: 注意: 1. < app >组件不知道它会接收什么内容,这是由使用< app >的父组件决定的。 ...
  • AprilCC
  • AprilCC
  • 2017年11月03日 14:40
  • 51

VUE2.0 全套demo讲解 基础4(条件渲染)

转载至http://blog.csdn.net/sinat_17775997/article/details/68940794 三篇基础发布之后,收到最多的就是谢谢楼主,其次的就是错别字有点多,...
  • AmberQu
  • AmberQu
  • 2017年11月29日 15:53
  • 11

Vue从入门到精通(4)--第三阶段:MVVM及流行框架简介

第三阶段 MVVM Vue、React、AngularJS简介及对比 MVVM    MVVM是一种框架模式,和传统的MVC模式相比,MVVM的最大特点是 数据驱动视图 ,即:修改数据来导致视图的更改...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:vue(4)
举报原因:
原因补充:

(最多只允许输入30个字)