Vue2 零基础入门 Vue2 零基础入门第三天 3.2 计算属性 && 3.3 vue-cli

Vue2 零基础入门

Vue2 零基础入门第三天

老师：黑马程序员

3 Vue基础入门(续)

3.2 计算属性

3.2.1 什么是计算属性

计算属性指的是通过一系列运算之后，最终得到一个属性值。

这个动态计算出来的属性值可以被模板结构或 methods 方法使用。

3.2.2 计算属性的特点

① 虽然计算属性在声明的时候被定义为方法，但是计算属性的本质是一个属性

② 计算属性会缓存计算的结果，只有计算属性依赖的数据变化时，才会重新进行运算

3.3 vue-cli

3.3.1 什么是单页面程序

单页面应用程序（英文名：Single Page Application）简称 SPA，顾名思义，指的是一个 Web 网站中只有唯一的一个 HTML 页面，所有的功能与交互都在这唯一的一个页面内完成。

3.3.2 什么是vue-cli

vue-cli 是 Vue.js 开发的标准工具。它简化了程序员基于 webpack 创建工程化的 Vue 项目的过程。

程序员可以专注在撰写应用上，而不必花好几天去纠结 webpack 配置的问题。

中文官网：

https://cli.vuejs.org/zh/

3.3.3 安装和使用

vue-cli 是 npm 上的一个全局包，使用 npm install 命令，即可方便的把它安装到自己的电脑上：

npm install -g @vue/cli
1

基于 vue-cli 快速生成工程化的 Vue 项目：

vue create 项目的名称
1

3.3.4 vue项目的运行流程

在工程化的项目中，vue 要做的事情很单纯：通过 main.js 把 App.vue 渲染到 index.html 的指定区域中。
其中：

① App.vue 用来编写待渲染的模板结构

② index.html 中需要预留一个 el 区域

③ main.js 把 App.vue 渲染到了 index.html 所预留的区域中