登录 |  注册
首页 >  编程技术 >  Vue入门学习教程 >  Vue实例

Vue实例

1. 前言

本节开始我们将正式进行 Vue 基础知识的学习。本小节我们将先介绍什么是 Vue 实例,包括如何创建 Vue 实例,Vue 实例上的属性参数,以及如何使用 Vue 开始工作。Vue 实例上的属性和方法很多,本小节我们不会详细介绍所有的属性和方法,同学们目前只需要了解什么是 Vue 实例以及如何创建它。

2. 优科解释

每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的。 — 官方定义

Vue 实例是通过 Vue 函数传入对应 options 参数创建出的一个实例对象。

3. 创建 Vue 实例

Vue 实例的创建是通过 new Vue(options) 来实现的,options 是创建 vue 实例传递的参数。它是一个对象:

//最简单的 options 对象示例:{
  el: "#app",  data() {
      return {}
    },
  }

接下来我们用一个简单的例子来学习如何创建 vue 实例:

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script>
  var vm = new Vue({
    el: "#app"
  })
</script>

代码解释
JS 代码第 3-10 行,我们使用 Vue 函数创建了一个实例对象,在调用函数时我们传入了一个对象参数,该对象只有一个 el 属性。
在之前的小节中我们学习到Vue是一个MVVM框架,所以在日常开发中我们通常将 Vue 实例的变量名取为 vm。当然,这并不是必须的,你也可以给他其他任意的变量名。

3.1 vue 实例参数

在上述的例子中,我们首先使用 Vue 函数创建一个新的 Vue 实例,并在创建实例的时候传入了一个选项对象,接下来我们逐个分析每个对象属性的意义。

  • el 属性

el 属性表示 Vue 实例要挂载的节点,该属性的值可以是一个 CSS 选择器,也可以是一个 HTMLElement。

原文链接: https://www.yukx.com/vuejs/article/details/2312.html 优科学习网Vue实例

<<上一课程
下一课程>>
推荐文章
  • 首先就是创建一个普通的Java工程,起名TrySpring,最终项目如下图:然后在创建两个包分别为service、spring。service用来存放bean、配置类等,spring包用来存放我们手撸的spring注解等在service中创建UserService类,再创建Test类,在Test类中
  •      AQS(AbstractQueuedSynchronizer)是一个抽象的队列同步器,通过维护一个共享资源状态(VolatileIntState)和一个先进先出(FIFO)的线程等待队列来实现一个多线程访问共享资源的同步框架。一、AQS原理     AQS为每个共享资源都设置一个共享资源锁
  • word-break:break-all举例一般情况下,元素拥有默认的white-space:normal(自动换行,PS:不换行是white-space:nowrap),当录入的文字超过定义的宽度后会自动换行,但当录入的数据是一堆没有空格的字符或字母或数字(常规数据应该不会有吧,但有些测试人员是会
  • Bigdecimal的初始化这里对比了两种形式,第一种直接value写数字的值,第二种用string来表示        BigDecimal num1 = new BigDecimal(0.005);         BigDecimal num2 = new BigDecimal(1000000
  • 基本概念定义 双亲委派模型要求除了顶层的启动类加载器外,其余的类加载器都应当有自己的父类加载器。双亲委派机制双亲委派机制是指当一个类加载器收到一个类加载请求时,该类加载器首先会把请求委派给父类加载器。每个类加载器都是如此,只有在父类加载器在自己的搜索范围内找不到指定类时,子类加载器才会尝试自己去加载
  • 主要看在resouces目录下的路径和mapper接口的路径是否一致。如接口路径:com.yukx.demo.mapper则在resouces目录下的文件路径:com/yukx/demo/mapper, 而不是如图的那个文件
学习大纲