vue2入门——如何创建一个vue实例?

101 阅读2分钟

vue是什么?

Vue 是一个用于构建用户界面的渐进式 JavaScript 框架。

一、基本概念

  • 渐进式框架:这意味着 Vue 可以根据项目的不同需求,灵活地应用于不同的场景。它可以被用于简单的小型项目,如一个小型的交互组件;也可以用于构建复杂的大型单页应用(SPA - Single Page Application)。例如,你可能只是想在一个已有的传统多页面网站中添加一个具有交互性的表单,那么就可以只引入 Vue 来处理这个表单部分,而不必对整个网站进行大规模重构。

  • 构建用户界面:Vue 的主要目的是帮助开发者更高效地创建和管理用户界面元素。它通过一种声明式的方式来描述 UI 应该如何呈现,使得开发者可以专注于数据和业务逻辑,而不是手动操作 DOM(Document Object Model)。

  • 二、核心特点

  1. 数据驱动视图
  • 在 Vue 中,数据和视图是相互绑定的。当数据发生变化时,视图会自动更新以反映新的数据状态。
  1. 组件化开发
  • Vue 允许将应用程序拆分成多个可复用的组件。组件就像是一个个独立的小部件,有自己的模板(HTML 结构)、数据(JavaScript 数据对象)和样式(CSS 或其他样式语言)。
  1. 指令系统
  • Vue 有一系列的指令,这些指令是带有v -前缀的特殊属性,这个我们下一篇文章会逐个介绍。

概念已经介绍完了,那我们就从最基础的——创建一个vue实例开始,核心步骤分为四步

1.准备容器
2.引包(官网:v2.cn.vuejs)➡起步➡安装➡复制开发版本
3.创建Vue实例 new Vue()
4.指定配置项➡渲染数据    ①el指定挂载点    ②data提供数据

屏幕截图 2024-12-23 180739.png 如此,我们就创建好了一个vue实例。