vue使用jsx/axios拦截器设置
最害怕的就是做过的事情,转几天又忘记了;写过的代码,也模模糊糊不知道哪里去了,所以告诉自己最好把每天遇到的问题记录下来,好,开始。
新公司要搭个vue后台框架,所以用了简简单单的 vue+iview+less+webpack
(https://github.com/iview/iview-admin) 克隆的这个系统。希望之后能用更多新的技术vuex等。
已解决的问题:
- (jsx)
使用iview框架的Tree组件时,自定义render函数的代码太多,还不易阅读,正好看到vue官网的vue+jsx语法,之前也接触过一点点react,对它稍微有点认知,就直接用这个依赖了,完美。

使用jsx的方法:
npm install
babel-plugin-syntax-jsx
babel-plugin-transform-vue-jsx
babel-helper-vue-jsx-merge-props
babel-preset-env
--save-dev配置.babelrc文件
{
"presets": ["env"],
"plugins": ["transform-vue-jsx"]
}
然后就可以使用了。
- axios调接口,在拦截器中设置,使请求成功进入then,请求失败进入catch(包括404等),请求拦截设置如果是post请求则用qs转一下,在响应拦截里控制整体的错误提示
-
还未解决的问题是git小乌龟使用ssh克隆时的错误,puttygen生成的秘钥中公钥虽然添加到了github账户上,但是克隆时候还是会显示格式错误,之后再弄吧,对了还有一台电脑使用多个秘钥的时候的情况,到时候参考这篇文章
http://www.cnblogs.com/zichi/p/4704824.html
接下来再看看es6、vue的api、less变量、webpack、vuex、还有买的小程序视频(https://time.geekbang.org/course/detail/77-5000) 然后封装下iview里的验证!!
vue使用jsx/axios拦截器设置的更多相关文章
- 每天一点点之vue框架开发 - axios拦截器的使用
<script> import axios from 'axios' export default { name: 'hello', data () { return { msg: 'We ...
- vue axios拦截器 + 自编写插件 实现全局 loading 效果;
项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...
- Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
准备 利用vue-cli脚手架创建项目 进入项目安装vuex.axios(npm install vuex,npm install axios) axios配置 项目中安装axios模块(npm in ...
- vue导航守卫和axios拦截器的区别
在Vue项目中,有两种用户登录状态判断并处理的情况,分别为:导航守卫和axios拦截器. 一.什么是导航守卫? vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航.(在路由跳转时 ...
- Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装
1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...
- axios拦截器的使用方法
很多时候我们需要在发送请求和响应数据的时候做一些页面处理,比如在请求服务器之前先判断以下用户是登录(通过token判断),或者设置请求头header,或者在请求到数据之前页面显示loading等等,还 ...
- 12. 前后端联调 + ( proxy代理 ) + ( axios拦截器 ) + ( css Modules模块化方案 ) + ( css-loader ) + ( 非路由组件如何使用history ) + ( bodyParser,cookieParser中间件 ) + ( utility MD5加密库 ) + ( nodemon自动重启node ) + +
(1) proxy 前端的端口在:localhost:3000后端的端口在:localhost:1234所以要在webpack中配置proxy选项 (proxy是代理的意思) 在package.jso ...
- vue+axois 封装请求+拦截器(请求锁+统一错误)
需求 封装常用请求 拦截器-请求锁 统一处理错误码 一.封装常用的请求 解决痛点:不要每一个模块的api都还要写get,post,patch请求方法.直接将这些常用的方法封装好. 解决方案:写一个类 ...
- 交互-通过axios拦截器添加token认证
通过axios拦截器添加token认证 一.通过axios请求拦截器添加token,保证拥有获取数据的权限 通常访问接口需要相关权限,通常是需要携带token如下所示 那如何在请求头中添加token? ...
随机推荐
- 使用selenium遍历frame中的表单信息 ;
遍历frame中的表单 : package webDriverPro; import java.util.List; import java.util.regex.Matcher; import ja ...
- 可以从Jar外部加载JDBC.properties的Spring-mybatis配置文件
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
- python接口自动化测试框架实现之操作mysq数据库
python操作mysql数据库需要使用到mysqlclient库. 安装:pip install mysqlclient python连接mysql数据库分以下步骤: 1.与mysql建立连接: 2 ...
- LoadRunner脚本增强技巧之手动关联
个人认为LoadRunner的手动关联技巧可以看做参数化的一种,区别在与获取参数的来源不同. 一般的参数化:把脚本中一个写死的数值或者字符串用一个变量参数来代替,每次迭代的时候,从本地文件或者数据库中 ...
- 【数据库】SQL两表之间:根据一个表的字段更新另一个表的字段
1. 写法轻松,更新效率高:update table1 set field1=table2.field1,field2=table2.field2from table2where table1.id= ...
- 小结ospf基本配置的三个参数
实例:<华为路由器学习指南>P712 OSPF基本功能配置示例拓扑结构 配置思路:以E为例子 [E]ospf 100 router-id 5.5.5.5[E-ospf-100]area 1 ...
- 【BZOJ4455】小星星(动态规划,容斥)
[BZOJ4455]小星星(动态规划,容斥) 题面 BZOJ 洛谷 Uoj 题解 题意说简单点就是给定一张\(n\)个点的图和一棵\(n\)个点的树,现在要让图和树之间的点一一对应,并且如果树上存在一 ...
- 【BZOJ1562】【NOI2009】变换序列(二分图匹配)
[BZOJ1562][NOI2009]变换序列 题面 BZOJ 洛谷 这题面写的是真的丑,还是先手动翻译成人话. 让你构造一个\(0..N-1\)的排列\(T\) 使得\(Dis(i,T_i)\)为给 ...
- 洛谷P1242 新汉诺塔 【神奇的递归】
题目描述 设有n个大小不等的中空圆盘,按从小到大的顺序从1到n编号.将这n个圆盘任意的迭套在三根立柱上,立柱的编号分别为A.B.C,这个状态称为初始状态. 现在要求找到一种步数最少的移动方案,使得从初 ...
- mysqldump备份恢复
数据库的备份恢复是DBA的必修课,本文首先讲解mysqldump完整备份恢复的操作方法,演示数据库完整备份的基本过程.然后再模拟数据库遭遇灾难性破坏,配合bin-log日志实验数据库灾难性恢复的步骤. ...