需求描述：

在写一个his项目时，我们需要根据医生的号源数来控制整个是否可以点击挂号，也就是根据属性的值来控制是否有点击事件

实现效果：

实现过程：

使用v-for遍历数组中的数据后得到一个num的值，那么我们就可以根据这个num的值在click中加入判定条件 @click="!item.num=='0' && goToDoctorPage()"即可实现用属性的值来控制点击事件是否可用

代码如下：

  <div class="doctor_list">

            <div class="doctor_button" v-for="(item, index) in doctorList" :key="index"  @click="!item.num=='0' && goToDoctorPage()"
                v-show="selectedIndex === item.id">
                <!-- 医生图片 -->
                <div class="img">
                    <img :src="item.imgURL" alt="">
                </div>

                <div class="doctor_msg">
                    <!-- 医生名字 职称 -->
                    <div class="doctor_title">
                        <span class="name">{{ item.name }}</span>
                        <span class="title">{{ item.title }}</span>
                        <span v-if="item.num>0" class="num"
                            :class="[item.num == '0' ? 'red_color' : '', item.num <= '20' ? 'yellow_color' : '']">余号：{{
                                item.num }}</span>
                        <span v-if="item.num==0" class="num gray_color">无号</span>
                    </div>

                    <!-- 医生简介 -->
                    <div class="doctor_discration">
                        <span class="discration">
                            擅长：{{ item.discration }}
                        </span>
                    </div>
                </div>

            </div>


        </div>