"(error during evaluation)" computed

在vue-cli搭建的去哪網app項目中使用了  computed  計算屬性

computed計算屬性在chrome插件中的 vue devtools 插件中報錯

應該顯示出來 computed 屬性的下拉列。

正確顯示如下，這里右下角正確的顯示出了computed ， 求助報錯原因！！！

 

 代碼如下：（紅色代碼處！）

<template>
    <div class="icons">
        <swiper>
            <swiper-slide>
                <div class="icon" v-for="item of iconList" :key="item.id">
                    <div class="icon-img">
                        <img class="icon-img-content" :src="item.imgUrl">
                    </div>
                    <p class="icon-desc">{{ item.desc }}</p>
                </div>
            </swiper-slide>
        </swiper>
    </div>
</template>

<script>
export default {
    name: 'HomeIcons',
    data() {
        return {
            iconList: [{
                id: '0001',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/piao.png',
                desc: '景點門票'
            },
            {
                id: '0002',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/hotel.png',
                desc: '酒單'
            },
            {
                id: '0003',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/flight.png',
                desc: '機票'
            },
            {
                id: '0004',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/package.png',
                desc: '度假'
            },
            {
                id: '0005',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/train.png',
                desc: '火車票'
            },
            {
                id: '0006',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/innBnb.png',
                desc: '民宿客棧'
            },
            {
                id: '0007',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/bargainflight.png',
                desc: '低價機票'
            },
            {
                id: '0008',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/group.png',
                desc: '特惠酒店'
            },
            {
                id: '0009',
                imgUrl: '//s.qunarzz.com/homenode/images/touchheader/haiwai.png',
                desc: '海外酒店'
            }]
        }
    },
   computed: { pages () { const pages = [] this.iconList.forEach((item, index) => { const page = Math.floor(index / 8) if(!pages[page]) { this.pages = [] } pages[page].push(item) }) return pages } }
}
</script>
<style lang="stylus" scoped>
    @import '~styles/varibles.styl'
    .icons >>> .swiper-container
        height 0
        padding-bottom 50%
    .icon
        position relative
        overflow hidden
        float left
        width 25%
        height 0
        padding-bottom 25%
        .icon-img
            position absolute
            left 0
            right 0
            top 0
            bottom .44rem
            box-sizing border-box
            padding .1rem
            .icon-img-content
                height 100%
                display block
                margin 0 auto 
        .icon-desc
            position absolute
            left 0
            right 0
            bottom 0
            height .44rem
            line-height .44rem
            text-align center
            color $darkTextColor
                    
</style>