"(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>