渐进式JavaScript框架，易学易用，性能出色，适用场景丰富的 Web 前端框架
地址：https://cn.vuejs.org/
什么是vue？
Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。
- 安装插件 vue.js
- 创建前端项目 (略)
- 导入vue.js文件
3.1 vue入门案例
3.2 vue指令(很重要)
- v-html
- v-text
- v-bind
- v-show
- v-on
- v-if
- v-for
- v-model ------MVVM
代码：
3.3 vue侦听属性和计算属性(了解)
- watch属性
- computed 属性
代码：
3.4 vue组件(很重要)
- 全局组件
任意的挂载点都可以使用
全局组件代码案例：
- 局部组件
只能在某一个vue实例的挂载点使用
局部组件代码案例：
3.5 vue路由（很重要）
什么是路由？
后端：对于普通网站，所有的超链接都对应一个url地址，每个url都对应服务器上的资源
前端：对于单页面应用程序来说的，主要通过url中的#（hash）去实现的，(当关于a标签)
路由使用
引入vue-router.js文件
案例：
4.1 什么是nodejs和npm？
*Node：是JavaScript的运行时环境*。Node并不是一个新的语言，只是js的一个环境，同样的比如：tomcat。Node为js提供了更强大的操作方式，如：在浏览器中，js是无法操作文件的，而node提供了文件操作。在浏览器中，js无法写服务接口，node提供了后端代码编写的功能（写后台、操作数据库）。尽管如此，Node依然是个前端技术，并不会真正的使用node去写后端代码，*node更多的是给前端项目做配置*，如：跨域代理。
*Npm：npm是node提供的一个包管理工具，类似于maven*。通过npm去安装依赖包，就不需要在页面上使用script标签引入了。 前端也有依赖
命令：-g（globle）全局安装，任何项目都可以用。–save-dev开发环境安装，不会打包到生产。生产安装（默认）
大前端工程: 人家可以使用node js 开发数据接口, 但是nodejs 的速度很差.
4.2 node下载和安装
- 下载地址： http://nodejs.cn/
- 安装（略） 不要安装在有中文，特殊字符等目录
- 测试安装是否成功
cmd命令 输入 node -v
cmd命令 输入 npm -v
- npm镜像加速器配置
执行命令 ：npm config set registry https://registry.npm.taobao.org （过期了，不能用了）
npm config set registry https://registry.npmmirror.com/ （可以使用，没过期）
删除淘宝镜像源： npm config delete registry
查看当前镜像源：npm config get registry
清缓存命令：npm cache clean --force
npm 常用命令：
安装命令： npm install xx 简写成 npm i xx
5.1. 什么是vue-cli
vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。
vue-cli是有Vue提供的一个官方cli，专门为单页面应用快速搭建繁杂的脚手架。它是用于自动生成vue.js+webpack的项目模板。
5.2. vue-cli安装
全局安装：
npm install -g @vue/cli
5.3. 查看版本信息
vue -V
5.4. 使用vue-cli创建项目
方式很多，我们这里面使用的是命令(idea)
- 手动创建： vue create my-project 注意：项目名不能有大写
- 使用idea创建： (看视频)
- 启动命令： npm run serve
- 打包命令： npm run build
单页面组件： 以.vue结尾的文件
三部分：
1. template ：编写 html代码
2. script: 编写js代码的
3. style: 编写样式的。
官网地址：https://element.eleme.cn/#/zh-CN/component/installation
使用：
- 安装： npm i element-ui -S
- 使用
在 main.js 中写入以下内容：
官网地址： 起步 | Axios中文文档 | Axios中文网 (axios-http.cn)
- 下载安装
npm install axios
- main.js中配置
点赞关注 威: c_-j_-c
到此这篇vue教程菜鸟教程（vue入门教程）的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章，希望大家都能在编程的领域有一番成就！版权声明：
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符，请将相关资料发送至xkadmin@xkablog.com进行投诉反馈，一经查实，立即处理！
转载请注明出处，原文链接：https://www.xkablog.com/qdvuejs/70127.html