{5}首页开发-1-2

四、添加接口

五、关注功能

1、关注组件上添加判断v-if="!item.isFollow"

  
  
  
  


   
   
   
   


   
   
   
   
    +关注

   
   
   
   


  
  
  
  

2、通过this.$emit()向父组件传递信息

  
  
  
  


   
   
   
   
follow(){

   
   
   
   
    console.log("关注");

   
   
   
   
    this.$emit('follow',this.index)

   
   
   
   
},

  
  
  
  

3、父组件接收信息

  
  
  
  


   
   
   
   


   
   
   
   



   
   
   
   
follow(e){

   
   
   
   
    console.log("已关注"+e)

   
   
   
   
    this.dynlist[e].isFollow = true;

   
   
   
   
    uni.showToast({

   
   
   
   
        title:"关注成功"

   
   
   
   
    })

   
   
   
   
}

  
  
  
  

六、顶踩功能

1、顶踩组件上添加样式判断 :class="item.support.type==='unsupport'?'color-main':''

  
  
  
  


   
   
   
   


   
   
   
   
 hover-class="bounceIn" @click="doSupport('support')" 

   
   
   
   
 :class="item.support.type==='support'?'color-main':''">

   
   
   
   
    

   
   
   
   
    {{item.support.support_count}}

   
   
   
   


   
   
   
   


   
   
   
   


   
   
   
   
hover-class="bounceIn" @click="doSupport('unsupport')"

   
   
   
   
:class="item.support.type==='unsupport'?'color-main':''">

   
   
   
   
    

   
   
   
   
    {{item.support.unsupport_count}}

   
   
   
   


  
  
  
  

2、通过this.$emit()向父组件传递信息

  
  
  
  


   
   
   
   
doSupport(type){

   
   
   
   
    console.log(type);  

   
   
   
   
    this.$emit('doSupport',

   
   
   
   
    {

   
   
   
   
        type:type,

   
   
   
   
        index:this.index

   
   
   
   
    })

   
   
   
   



   
   
   
   
}

  
  
  
  

3、父组件接收信息

  
  
  
  


   
   
   
   
doSupport(e){

   
   
   
   
    console.log(e)

   
   
   
   
    let item = this.dynlist[e.index];

   
   
   
   
    switch(item.support.type){

   
   
   
   
        case '':

   
   
   
   
            item.support[e.type+'_count']++

   
   
   
   
            break;

   
   
   
   
        case 'support':

   
   
   
   
            {

   
   
   
   
                if(e.type==='unsupport'){

   
   
   
   
                    item.support['support_count']--

   
   
   
   
                    item.support['unsupport_count']++

   
   
   
   
                }

   
   
   
   
            }

   
   
   
   
        break;

   
   
   
   
        default:

   
   
   
   
            if(e.type==='support'){

   
   
   
   
                item.support['support_count']++

   
   
   
   
                item.support['unsupport_count']--  

   
   
   
   
            }

   
   
   
   
        break;

   
   
   
   
    }

   
   
   
   
    item.support.type = e.type;

   
   
   
   
}