Vue实例
94
2022-05-03 12:14:24
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。
推荐文章
-
1.前言本小节将带领大家学习一下如何安装Vue。包括独立版本、CDN、NPM、CLI工具四种不同的安装方法。2.独立版本我们可以在Vue.js的官网上直接下载vue.min.js并用script标签引入。下载Vue.js安装步骤:打开Vue.js下载地址并拷贝所有代码。创建vue.min.js文件,
-
大家好,今天我们开始一个新专题—Vue。这个专题我们重点针对如何使用Vue开发项目。本文我们主要先介绍一下Vue是什么?1.什么是Vue什么是Vue呢?Vue(读音/vjuː/,类似于view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用。Vue的核
-
什么是高并发?高并发(HighConcurrency)是互联网分布式系统架构设计中必须考虑的因素之一,它通常是指,通过设计保证系统能够同时并行处理很多请求。高并发相关常用的一些指标有响应时间(ResponseTime),吞吐量(Throughput),每秒查询率QPS(QueryPerSecond)
-
C++有用的资源以下资源包含了C++有关的网站、书籍和文章。请使用它们来进一步学习C++的知识。C++有用的网站C++ProgrammingLanguageTutorials−C++编程语言教程。C++Programming−这本书涵盖了C++语言编程、软件交互设计、C++语言的现实生活应用。C++
-
C++Web编程什么是CGI?公共网关接口(CGI),是一套标准,定义了信息是如何在Web服务器和客户端脚本之间进行交换的。CGI规范目前是由NCSA维护的,NCSA定义CGI如下:公共网关接口(CGI),是一种用于外部网关程序与信息服务器(如HTTP服务器)对接的接口标准。目前的版本是CGI/1.
-
C++异常处理异常是程序在执行期间产生的问题。C++异常是指在程序运行时发生的特殊情况,比如尝试除以零的操作。异常提供了一种转移程序控制权的方式。C++异常处理涉及到三个关键字:try、catch、throw。throw:当问题出现时,程序会抛出一个异常。这是通过使用throw关键字来完成的。cat