Vue的网络请求、插槽、Vuex

axios

npm i axios

跨域问题，协议名+ip+端口号。

实际上，浏览器是收到数据的，但是没有交付给开发者。

解决跨域问题

创建代理服务器。代理服务器和前端端口是一样的，所以不存在跨域问题。代理服务器与后端服务器都是服务器，和浏览器没有关系，使用http协议传输数据，所以数据能正常交付给代理服务器。

1、如何创建代理服务器

nginx

2、借助vue-cli

配置参考 | Vue CLI

module.exports = {
  devServer: {
    proxy: 'http://localhost:4000'
  }
}

public文件夹下边有的，都算是8080服务器有的。可以直接请求访问。如果public下边有，则不用访问后端服务器，可以直接去public下边有的。

3、配置多个代理服务器

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: '<url>',
        ws: true,
        changeOrigin: true
      },
      '/foo': {
        target: '<other_url>'
      }
    }
  }
}

兄弟组件间通信

main.js注册全局总线

beforeCreate(){
    Vue.prototype.$bus = this
}

List.vue 【收数据】

mounted(){
    this.$bus.on('userList',(users)=>{
        console.log('我是List组件，收到了数据',users)
    })
}

Search.vue 【传递数据】

this.$bus.$emit('userList',response.data.items)

展示数据

<template>
    <!-- 展示用户列表 -->
    <div class="row" v-show="users.length">
        <div class="card" v-for="user in users" :key="user.login"> 
            <a :href="