Contents
  1. 1. 简介:
  2. 2. Vue简介:
  3. 3. vue 项目目录:
  4. 4. axios简介:

简介:

今天突发奇想,虽然之前一直从事javaweb开发,一直想的是自己以后的工作方向也是java。其实现在想来自己在工作中前端和后端开发一半一半吧。而且这个个性化时代,页面的展示仿佛已经是重中之重了。但是现在的话自己没经历过一个完整的vue开发项目,所以只能从零开始学习了。

Vue简介:

Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API。

特点:

1.MVVM

2.组件化

npm —nodejs的包管理器

webpack — vue的组件都是通过.vue等自定义的组建都无法被用户端的各种浏览器解析,需要被翻译和打包生成.js文件。

vue-cli 用于生成模板的vue工程,脚手架。‘

vue-cli 脚手架的下载 npm install vue-cli -g

vue 模板下载 npm install –global vue-cli

npm install 下载依赖

npm run dev 启动项目

vue 项目目录:

目录/文件 说明
build 项目构建(webpack)相关代码
config 配置目录,包括端口号等。我们初学可以使用默认的。
node_modules npm 加载的项目依赖模块
src 这里是我们要开发的目录,基本上要做的事情都在这个目录里。里面包含了几个目录及文件:assets: 放置一些图片,如logo等。components: 目录里面放了一个组件文件,可以不用。App.vue: 项目入口文件,我们也可以直接将组件写这里,而不使用 components 目录。main.js: 项目的核心文件。
static 静态资源目录,如图片、字体等。
test 初始测试目录,可删除
.xxxx文件 这些是一些配置文件,包括语法配置,git配置等。
index.html 首页入口文件,你可以添加一些 meta 信息或统计代码啥的。
package.json 项目配置文件。
README.md 项目的说明文档,markdown 格式

img

axios简介:

axios 是基于Promise用于浏览器和nodejs的http客户端,本质上也是对原生XHR的封装,只不过它是对promise的实现版本,符合最新额ES6,本身具有的特性:

1.从浏览器中创建 XMLHttpRequest
2.支持 Promise API
3.客户端支持防止CSRF
4.提供了一些并发请求的接口(重要,方便了很多的操作)
5.从 node.js 创建 http 请求
6.拦截请求和响应
7.转换请求和响应数据
8.取消请求
9.自动转换JSON数据

:防止CSRF:就是让你的每个请求都带一个从cookie中拿到的key, 根据浏览器同源策略,假冒的网站是拿不到你cookie中得key的,这样,后台就可以轻松辨别出这个请求是否是用户在假冒网站上的误导输入,从而采取正确的策略

axios 既提供了并发封装,也没有fetch的各种问题,而且体积较小,是当前最应该选用的请求方式。

Contents
  1. 1. 简介:
  2. 2. Vue简介:
  3. 3. vue 项目目录:
  4. 4. axios简介: