Vue小练习 03

"""
1、有以下广告数据(实际数据命名可以略做调整)
ad_data = {
        tv: [
                {img: 'img/tv/tv1.jpg', title: 'tv1'},
                {img: 'img/tv/tv2.jpg', title: 'tv2'},
                {img: 'img/tv/tv3.jpg', title: 'tv3'},
                {img: 'img/tv/tv4.jpg', title: 'tv4'},
            ],
            phone: [
                {img: 'img/phone/phone1.jpg', title: 'phone1'},
                {img: 'img/phone/phone2.jpg', title: 'phone2'},
                {img: 'img/phone/phone3.jpg', title: 'phone3'},
                {img: 'img/phone/phone4.jpg', title: 'phone4'},
            ]
    
}

i) 有两个大标题,电视和手机,点击对应的标题,渲染对应的数据
ii) 一个字典作为一个显示单位,定义一个子组件进行渲染(涉及父子组件传参)

2、在第1题基础上,页面最下方有一个 h2 标签,用来渲染用户当前选择的广告(点击哪个广告就是选中哪个广告)
i)当没有点击任何广告,h2 标签显示:未选中任何广告
ii)当点击其中一个广告,如tv1,h2 标签显示:tv1被选中
"""



    
    作业1
    





    
    作业2
    


{{ v1 }}

你可能感兴趣的:(Vue小练习 03)