VUE vue-router

VUE的路由：路由就是网址的切换。
如何进行：1.安装v-router
npm install --save vue-router
2.在app.vue中引用
import router from 'vue-router' Vue.use(router)
3.确定视图加载的位置
<router-view></router-view>

---

如何进行路由的跳转：
<router-link to="/"></router-link>
例如：
<router-link to="/hello">helloworld</router-link> <router-link to="hellomika">hellomika</router-link>
4.vue-router路由参数的传递

1.必须在路由内加入路由的name
routes: [{ name:'Helloword',//必须要加上name path: '/hello', component: Helloword }]
2.必须在path:后加上/:+传递的参数
routes: [{ name:'Helloword', path: '/hello/:worldmsg',//必须加上/:+传递的数据 component: Helloword// }
3.传递参数和接收参数看下边的代码：
传递:<router-link :to="name:'Helloword',params:{worldmsg:'这是要传递的数据'}">传递数据</router>
接收:{{$$route.params.worldmsg}}

---

Axios之get请求详解
axios的简介：
axios是一个基于Promise用于浏览器和nodejs的HTTP客户端,他本省具有以下特征

1.从浏览器中创建XMLHttpRequest
2.从node.js发出http请求
3.支持Promise Api
4.拦截请求和响应
5.转换请求和响应数据
6.取消请求
7.自动转换JSON数据
8.客户端支持防止CSRF/XSRF
总结：发送请求和拦截响应
如何使用
.安装
npm install axios
.引入加载
import axios from 'axios'
.将axios全局挂载到VUE原型上
Vue.prototype.$http=axios; $xxx名字自起
发出请求
export default { name: "HelloWorld", data() { return { items: [] }; }, methods: { getDate() { //此处的THIS指向的不是当前的实例.所以要定义this var self = this; this.$http .get("https://cnodejs.org/api/v1/topics", { params: { page:1, //限制显示几行 limit:5 } }) .then(function(response) { self.items=response.data.data console.log(self.items); console.log("11"); }) .catch(function(error) { console.log(error); }); } } };
this.$http.get("https://cnodejs.org/api/v1/topics?page=1&limit=15,{ID:111}}) 限制几页，显示多少行
使用POST传递数据：
把上面的get改成post
this.$http .post(url,qs.stringify({ page:1, //限制显示几行 limit:5 } })

在axios中,post请求接收的参数必须是form-data
安装qs插件