安装

yanxiu-yarn add yanxiu-group-card 

使用方法

main.js

// main.js
import Vue from 'vue';
import YanxiuGroupCard from 'yanxiu-group-card';

Vue.use(YanxiuGroupCard);

list.vue

注意事项：

<template>
 
    <Yanxiu-group-card :size='size' :data="groupItem"></Yanxiu-group-card>

</template>

<script>

  export default {
    data() {
      return {
        size:"middle",
        url:"",
        groupItem:{
            schoolName:"吴忠市朝阳小学",
            city:"宁夏吴忠市",
            groupRange:1,   //1  本校    2  跨校
            groupId:"",
            managerCall:"XXXXXXXXXX",
            groupName:"数学区域协作组",
            groupLogo:"https://srt-read-dev.3ren.cn/basebusiness/headimg/20190114/1547451205369WckE7PG2qM.jpg?x-oss-process=image/resize,h_100"
        },
        hasImg:true  
      }
    },
    methods: {

    }
  }
</script>

API

传参

props:{
  size: "large":  图片70*70  两行文字
        "middle"：46*46 两行文字 
        "middleOneline":   46*46---一行说明 
        "small": 20*20  一行说明

    data:{
        schoolName: 学校名称
        area:学校所在市区信息
        groupRange: 是否跨校协作组  (1:本校协作组 2:跨校协作组)
        managerCall:组长
        groupName:组名
        groupLogo:小组logo
        groupId:小组id
    },

    hasImg:true//显示图片   false//不显示图片 
    
    url:""   //跳转地址
}   

| 参数名 | 是否必传 | 默认值 | 说明 | | ------ | ------ | ------ | ------ | | size | 否 | middle | 46*46 两行文字 | groupItem | 是 | {} | 单个协作组信息 |hasImg| 否 | true | 显示头像 | url | 否 | "" | 自定义跳转路径

方法

无

slot

无