《vue全家桶》移动端博客-类别推荐（4）

1.实现需求

2.数据准备

   categoryDatas() {
                return [{
                        id: 0,
                        name: 'HTML',
                        des: `28篇文章`,
                        url: '/categories/1000000000'
                    },
                    {
                        id: 1,
                        name: 'CSS',
                        des: `99篇文章`,
                        url: '/categories/1100000000'
                    },
                    {
                        id: 2,
                        name: 'Mobile',
                        des: `7篇文章`,
                        url: '/categories/1600000000'
                    },
                    {
                        id: 3,
                        name: 'NodeJS',
                        des: `24篇文章`,
                        url: '/categories/1701000000'
                    },
                    {
                        id: 4,
                        name: 'Utils',
                        des: `59篇文章`,
                        url: '/categories/1500000000'
                    },
                    {
                        id: 5,
                        name: 'Vue',
                        des: `34篇文章`,
                        url: '/categories/1403000000'
                    },
                    {
                        id: 6,
                        name: 'Javascript',
                        des: `219篇文章`,
                        url: '/categories/1200000000'
                    },
                    {
                        id: 7,
                        name: 'React',
                        des: `10篇文章`,
                        url: '/categories/1404000000'
                    }
                ]
            }
        }
    }

 

3.前端实现

 

4.样式编写