码迷,mamicode.com
首页 > 其他好文 > 详细

Vue模拟后台数据,proxy代理

时间:2018-08-09 12:19:40      阅读:365      评论:0      收藏:0      [点我收藏+]

标签:method   sse   ted   接收   跳转   set   后台   his   code   

config>index.js  设置代理,让api路径跳转到虚拟数据的路径

assetsSubDirectory: ‘static‘,
    assetsPublicPath: ‘/‘,
    proxyTable: {
        ‘/api‘: {
            target: ‘http://localhost:8080‘,
            pathRewrite: {
                ‘^/api‘: ‘/static/mock‘
            }
        }

在子组件请求数据

methods: {
    getHomeInfo () {
      axios.get(‘/api/index.json‘).then(this.getHomeInfoSucc)    这里/api会被代理成/static/mock虚拟数据的文件路径
    },
    getHomeInfoSucc (res) {   对数据进行处理
      res = res.data  将数据里面的data拿到
      if (res.ret && res.data) {  做一个判断,当数据成功接收且数据不为空
        const data = res.data  
        this.city = data.city
        this.swiperList = data.swiperList
        this.iconList = data.iconList
        this.recommendList = data.recommendList
        this.weekendList = data.weekendList
      }
      console.log(res)
    }
  },
  mounted () {   在mounted执行时获取数据
    this.getHomeInfo()
  }

 

Vue模拟后台数据,proxy代理

标签:method   sse   ted   接收   跳转   set   后台   his   code   

原文地址:https://www.cnblogs.com/island1994/p/9447787.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!