总结
1.npm --save 和 --save-dev 有什么区别
发布到线上的叫生产环境~,在本地开发的时候叫开发环境,--save就是会打包到线上去并且在线上环境能用到的,比如你npm install 一个vue-router,这个在线上环境也是能用到的依赖,所以你要--save~ 比如vue-loader这个组件只需要在开发的时候编译就好,线上并不需用的到,所以就放在开发的--save-dev里就好~~~~
2.安装vue axios
axios 官方文档http://www.axios-js.com/
npm安装
npm install --save axios vue-axios
main.js 引入
import axios from 'axios' import VueAxios from 'vue-axios' Vue.use(VueAxios, axios) import 引用, Vue.use 注册到vue 实例上
vue.use 与Vue.prototype. $xx 区别
Vue经典面试题: Vue.use和Vue.prototype.$xx有血缘关系吗?
index.vue 页面 中使用
## 方法一 this.axios.get(api).then((response) => { console.log(response) }) ## 方法二 this.$http.get(api).then((response) => { console.log(response) }) ### 在.vue文件中使用 this 代表当前vue , (response)=>{}采用的是es6写法 解决函数内this指向问题
3.vue部署apache 刷新页面 404
添加伪静态 ->新建文件.htaccess文件
<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L] </IfModule>
4. axios 并发请求
this.axios.all([this.axios.get('/api/index/index'),this.axios({ url:"/api/Address/index", params:{ user_id:1 } })]).then(res=>{ console.log(res); }) ## /api 更改为自己的地址 ## 这里是两种get请求写法,第二个写法默认是get请求, get请求传参数必须使用params:{} ## 缺点 结果为下图 拿数据的话 只能 res[0],res[1]
this.axios.all([this.axios.get('/api/index/index'),this.axios({ url:"/api/Address/index", params:{ user_id:1 } })]).then(this.axios.spread((res1,res2)=>{ console.log(res1); console.log(res2); })) ## 使用 axios.spread ## 现在 数据是展开的状态 ,如下图