1.安装node.vue这些最基础最简单的安装的就一一省略过. 1.1 axios 安装 1.2安装 Element-Ui 插件 1.3 安装 qs 1.4  安装 Mock 2.新建一个vue工程,打开cmd cd到工程目录下,或者在文件夹选中项目工程同时按住Ctrl+shift键,右击选中的项目找到[在此处打开powershell窗口],点击打开 效果如下: 执行命令: vue init webpack ? Generate project in current directory? Yes

谷歌chrome浏览器自带http抓包工具 chrome://net-internals/ 谷歌chrome浏览器http请求模拟插件:postman 火狐http请求模拟插件:httprequest 火狐http抓包插件:firebug

1.需求背景 最近在实验室写一个Spring前后端分离的项目,项目中使用Spring Security组件实现系统的认证和授权,当Security的认证模式设置为FormLogin时(如下代码),前端必须要使用表单且使用POST方法提交用户名和密码.否则后端无法接受前端提交的用户名和密码 http.formLogin() //表单提交用户名和密码,且为POST 2.解决方法 这里介绍两种解决方法,第一种是老实地写一个表单提交(注意一定要使用POST请求).第二种是使用axios模拟表单提交. 2

一.Vue-router(路由) 1.1路由创建 官网:https://router.vuejs.org/zh/ 用 Vue.js + Vue Router 创建单页应用,是非常简单的.使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 Vue Router 添加进来,我们需要做的是,将组件 (components) 映射到路由 (routes),然后告诉 Vue Router 在哪里渲染它们. 安装vue路由: npm install vue-router --save 在

最近工作不是很忙,自己做了一个vue的移动端的小项目,涉及到后台数据的时候,网上查阅了一些资料,因为是自己写的项目没有后台只能自己模拟数据,刚开始就自己写了一些静态数据后来觉得尽量模拟真实的比较好些,刚好也了解一下axios因为之前用的是vue-resource,就此开始挖坑填坑之路------- 首先说一下mock.js  http://mockjs.com/这是它的官网,讲的还是很详细,主要有各种数据模板可以去定义,废话不多说,下面开始正文 1.安装mock npm install mock

ajax 可以通过 FormData 对象模拟表单提交数据 第一种方式:自定义FormData信息 //创建formData对象 var formData = new FormData(); //添加键值对 formData.append("team_id", this.team_id) formData.append("content", this.content) formData.append("img", this.img) formDa

前言 自从Vue2.0推荐大家使用 axios 开始,axios 被越来越多的人所了解.使用axios发起一个请求对大家来说是比较简单的事情,但是axios没有进行封装复用,项目越来越大,引起的代码冗余.就会非常麻烦的一件事.所以本文会详细的跟大家介绍,如何封装请求,并且在项目组件中复用请求.有需要的朋友可以做一下参考. 封装的基本要求 统一 url 配置 统一 api 请求 request (请求)拦截器,例如:带上token等,设置请求头 response (响应)拦截器,例如:统一错误处理

安装 cnmp i vue-resource --save (--save 安装到dependencies下) 引用 <script src="node_modules/vue-resource/dist/vue-resource.min.js"></script> Vue-resource 7种请求API get ( url , [options] ) 从服务器端拿数据 head delete jsonp post 提交数据 put patch get:fun

自己写练手项目的时候常常会遇到一个问题,没有后台接口,获取数据总是很麻烦,于是在网上找了下,发现一个挺好用的模拟后台接口数据的工具:mockjs.现在把自己在项目中使用的方法贴出来   先看下项目的目录,这是用vue-cli生成的一个vue项目,主要是需要配置axios和写接口数据mock.js 首先需要安装axios和mockjs npm i axios mockjs --save       在项目中新建一个config目录,与src同级,配置axios ./config/axios.js

之前用Vue+element写了一个后台管理系统,在登录时使用axios请求数据传参时无法正常的获取数据.发现原因是传递参数要将参数序列化.这里使用了qs插件: 简单来说,qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库. 在项目中使用命令行工具输入:npm install qs安装完成后在需要用到的组件中:import qs from 'qs’具体使用中我查看了:qs.parse()和qs.stringify() 这两种方法虽然都是序列化,但是还是有区别的.qs.parse()是

axios本身没有同步请求,但是我们很多情况下必须得需要同步请求.那么应该怎么做? 上网查了一些资料有人说用es6的 async +  assert 我不知道有没有效果,因为我的功能中是没啥效果的. 那么怎么办?项目得接着写,说实话,作为一个后端开发,es6是属实不是很了解.但是我记得以前在某篇博客中见到过一个es6的新语法 promise,他好像可以.抱着试一下的心态,果然有效果!!! 使用详情请见 https://www.runoob.com/w3cnote/es6-promise.html

  gzip gzip一种压缩方式,或者是文件形式,它主要用于网络传输数据的压缩 gzip压缩好不好用 浏览器:网速一定.内容越小.请求响应的速度是不是更快 手机server:返回数据类型是json/xml->文本-->压缩率会很高. gzip执行流程 //1. 告知服务器.客户端支持gzip解压 * get.addHeader("Accept-Encoding", "gzip"); //2. 根据响应头得知服务器知否进行了gzip压缩 * Header

  gzip gzip一种压缩方式,或者是文件形式,它主要用于网络传输数据的压缩 gzip压缩好不好用 浏览器:网速一定.内容越小.请求响应的速度是不是更快 手机server:返回数据类型是json/xml->文本-->压缩率会很高. gzip执行流程 //1. 告知服务器.客户端支持gzip解压 * get.addHeader("Accept-Encoding", "gzip"); //2. 根据响应头得知服务器知否进行了gzip压缩 * Header

vue-cookie插件 安装 >: cnpm install vue-cookies main.js配置 // 第一种方式 import cookies from 'vue-cookies' // 导入插件 Vue.use(cookies); // 加载插件 new Vue({ // ... cookies, // 配置使用插件原型 $cookies }).$mount('#app'); // 第二种方式 import cookies from 'vue-cookies' // 导入插件 Vu

---恢复内容开始--- 项目初始化 创建一个纯净的vue环境项目,手动书写全局的样式配置,全局的main,js配置 (1)如果vue项目在重构或者出错的时候,手动安装node_modules. 如果缺失node_modules节点模块,启动项目会如下报错: 再次安装刷新即可,系统会自动加载node-modules文件内容 新项目模板的创建,接下来就是修改main.js路由等配置 设置全局的css样式,新建一个global.css,存放在assets文件夹下面. 把vue项目框架自带的home.

1 创建一个vue的项目 使用命令 vue create axios-vue 创建,可以什么都不用勾选 2 安装axios npm install axios --save 如果安装过程很慢的话,也可以使用下面的cnpm npm install cnpm -g --registry=https://registry.npm.taobao.org cnpm install axios --save 3 创建封装请求的文件夹 用vue插件的方式封装,而不是使用工具类进行封装. 这样方便使用,只需要在

前言 Qualoth是韩国FXGear公司推出的一款布料模拟插件,可以计算出很自然的衣褶以及动态效果,并且能应对大幅度动作的碰撞解算,可以和Houdini的Cloth Solver相媲美: 目前这款插件的教程很少,只能找到一个冗长的韩文视频以及官方帮助文档,没有其他更详细的教程: 我下载了for Maya的版本体验了一段时间,摸索出大体的制作流程,现分享如下: 制作流程 Qualoth的制作流程和nCloth差别较大,主要是前期衣物建模流程的不同,前几步类似传统服装制作: 1.先用Curve曲线

在自己的vue小项目中使用了axios这个插件,但是发现在axios请求数据成功之后的回调函数中this并不是指向当前vue实例, 在如下代码中 谷歌浏览器中报  this.goodsArr 未被定义 data(){ return{ goodsArr : [] } }, mounted : function(){ this.getGoodsList(); }, methods:{ getGoodsList(){ axios.get('/api/goods').then( function(res

无扩展,不 Chrome :几款 Chrome 扩展程序推荐 相信很多人都在使用 Chrome 浏览器,其流畅的浏览体验得到了不少用户的偏爱,但流畅只是一方面, Chrome 最大的优势还是其支持众多强大好用的扩展程序(Extensions). 少数派官微最近不定期推荐了一些 Chrome 扩展,得到了不错的反响,于是我们作了一番整理,把 几款优质的 Chrome 扩展集中推荐给大家. 下载方式: 下面这个谷歌商店的网址可FQ的直接搜索下载即可:https://chrome.google.com

1.通过axios实现数据请求 vue.js默认没有提供ajax功能 所以使用vue的时候,一般都会使用axios的插件来实现ajax与后端服务器的数据交互. 注意,axios本质上就是javascript的ajax封装,所以会被同源策略限制. 下载地址: https://unpkg.com/axios@0.18.0/dist/axios.jshttps://unpkg.com/axios@0.18.0/dist/axios.min.js axios提供发送请求的常用方法有两个:axios.ge

axios  的使用 1.安装  cnpm  install  axios --save 2.哪里用哪里引入axios <script> import Axios from 'axios';//引用插件 export default { data() { return { list: [] } } , methods: { getData() { var api = 'http://www.phonegap100.com/appapi.php?a=getPortalList&catid