SOURCE

console 命令行工具 X clear

                    
>
console
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
    <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>

<body>
    <div id="app">
        <ul>
            <div>courseid=9</div>
            <li v-for="(course, index) in title">
                {{course.thumbnail}} {{course.fileId}} {{course.id}}
                <span   v-if="index===nowIndex">此图片按钮只显示第二行</span>
            </li>
        </ul>
    </div>

    <script>
        var courseid = 9;
        var vm = new Vue({
            el: '#app',
            data: {
                "seen": "",
                'title': '',
                'nowIndex': 1
              
            },
            created() {
                this.THIS();
            },
            methods: {
                THIS: function() {
                    const salf = this;
                    var thumbera = [{
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 4,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 0,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 9,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 0,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 10,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 4,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 11,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 4,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 12,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 4,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 13,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 4,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }, {
                        "thumbnail": "http://www.jiazhangmooc.com:8081/images/xuanxiu/4.jpg",
                        "collectId": 0,
                        "noteCount": 0,
                        "id": 5,
                        "isFinish": 0,
                        "title": "title",
                        "plan": 0,
                        "isCollected": 0,
                        "fileId": "9031868223243112859"
                    }]
                    thumbera.forEach(function(item, i) {
                        if (courseid == item.id) {
                            console.log(item.id + "匹配成功" + courseid);
                            salf.seen = true;
                        } else {
                            console.log(item.id + "匹配失败" + courseid);
                            salf.seen = false;
                        }
                    })
                    this.title = thumbera;
                }
            }
        })
    </script>
</body>

</html>