Vuejs从远程源

时间:2016-02-05 10:44:17

标签: javascript api fetch vue.js

我使用以下代码检测按钮点击,并从unsplash获取具有随机模式的图像。

问题是它有效一次,取一个随机的。但第二次它没有改变..

  

它没有重新请求它,它只是没有改变它,因为它与我认为的URL相同。

var vue = new Vue({
  el: '#app',
  data: {
    styleObject: {
        background: 'url(https://unsplash.it/1920/1080)'
    }
  },
  methods: {
    getImage: function() {
        vue.styleObject.background = 'url(https://unsplash.it/1920/1080?random)'
    }
  }
})

我尝试删除变量

getImage: function() {
    vue.styleObject.background = '';
    vue.styleObject.background = 'url(https://unsplash.it/1920/1080?random)'
}

但仍然没有成功,任何想法? 谢谢

1 个答案:

答案 0 :(得分:6)

您可以尝试进行一些缓存制动。我认为是您的浏览器缓存请求并使用相同的图像为您提供服务。尝试在请求的末尾附加一个随机字符串,如下所示:

 methods: {
    getImage: function() {
        var max = 90000;
        var min = 10000;
        var slug = Math.random() * (max - min) + min;
        vue.styleObject.background = 'url(https://unsplash.it/1920/1080?random&s=' + slug +')';
    }
  }

希望这有帮助