vue 切换div显示隐藏,多选,单选

切换div显示隐藏

1)单个item下的部分dom结构,显示或隐藏切换,不会修改其它同级dom的显示/隐藏

template dom结构

          <div class="list-item" v-for="(list,index) in jobList">
                    <p class="job-name">{{list.jobName}}p>
                    <p class="job-info">
                        <el-checkbox  v-model="list.checked" @change="checkOne(index)">el-checkbox>
                        <span class="info">{{list.locationDesc}}  {{list.minDegreeDesc}}及以上   {{list.minExp}}年以上  {{list.jobMinSalary}}-{{list.jobMaxSalary}}span>
                        <span class="time">发布时间:{{list.refreshTime}}span>     
                        <span class="desc"  @click="toggle(index)">查看职位描述
                            <i class="up"   v-if = "list.show">i>
                            <i class="down"   v-if = "!list.show">i>
                        span>                    
                    p>
                    <div class="desc-info"  v-if = "list.show">
                        {{list.jobDesc}}
                    div>
                div> 

 

script js


                    
                    

你可能感兴趣的:(vue 切换div显示隐藏,多选,单选)