记录一下——vue的走马灯carousel使用v-for时的坑

vue的走马灯carousel使用v-for的双重循环出现页面未随数组的改变而更新，并且F5刷新页面也没有用，问题是在于将数组存入对象时vue未重新渲染出来，需要使用this.$forceUpdate() 进行强制的刷新

          
            // 双层循环，出现页面未渲染的问题
              
                

                  
                
                

                  
{
    {item.Name}}
                  

                    {
    {item.artist}}
                  
                  

                    
                      {
    {item.num}}
                    
                  
                  

                
              
            
          
        

methods: {
    getHomeInfo () {
      axios.get(url)
        .then(this.getHomeInfoSucc)
    },
    getHomeInfoSucc (res) {
      res = res.data
      if (res.code === 1) {
        var k = 0
        console.log(res)
        for (var e = 0; e <= (res.data.length / 3); e++) {
          let arr = {}
          for (var i = 0; i < 3; i++) {
            arr[i] = res.data[k++]
            if (k === res.data.length) {
              break
            }
          }
          this.hotMovie[e] = arr
        }
        this.$forceUpdate() //解决方法，使用 this.$forceUpdate()来强制vue进行组件的重新渲染
        console.log(this.hotMovie)
      }
    }
  },
  mounted () {
    this.$nextTick(this.getHomeInfo())
  }