标签：province flex 一次 valParams 样式 hospital getlist flexgrow hospitalLsit

<template>   <div>     <div class="searchTop">       <div class="text" @click="showArea">{{province}}</div>       <div class="disflex">         <div>           <img src="../../assets/images/black.png" alt class="black" />         </div>         <div class="vansearch">           <van-search             v-model="value"             shape="round"             placeholder="搜索医院、城市"             @input="valueChange"             @clear="valueClear"           />         </div>       </div>     </div>     <div class="tag"></div>     <div v-for="(item,index) in getlist" :key="index" class="nameBox">       <div class="name">{{item}}</div>     </div>     <addresspopup       :title="'地区'"       @confirmAddr="confirmAddr"       @cancleAddr="cancleAddr"       :showPopup="showPopup"     ></addresspopup>   </div> </template>
<script> import addresspopup from "../../components/address-popup.vue"; import hospitalLsit from "@/mixins/hospital-dfpz";
export default {   name: "areaSearch",
  components: { addresspopup },
  data() {     return {       hospitalLsit: [],       value: "",       areaList: {},       showPopup: false, // 地区选择显示       getlist: [],       province: ""     };   },   created() {     this.hospitalLsit = hospitalLsit.hospital;   },   mounted() {     this.getBeijing();   },   methods: {     getBeijing() {       this.province = "北京市";       let valParams = {         province: "北京市",         city: "北京市"       };       for (let i in this.hospitalLsit) {         if (           valParams.province == this.hospitalLsit[i].province &&           valParams.city == this.hospitalLsit[i].city         ) {           //   console.log(this.hospitalLsit[i].hospital);           this.getlist.push(this.hospitalLsit[i].hospital);         }       }     },     showArea() {       this.showPopup = true;     },     cancleAddr(val) {       this.showPopup = false;     },     confirmAddr(val) {       this.getlist = [];       this.showPopup = false;       let valParams = {         province: val[0].name,         city: val[1].name       };       this.province = val[1].name;       for (let i in this.hospitalLsit) {         if (           valParams.province == this.hospitalLsit[i].province &&           valParams.city == this.hospitalLsit[i].city         ) {           //   console.log(this.hospitalLsit[i].hospital);           this.getlist.push(this.hospitalLsit[i].hospital);         }       }     },     valueChange() {       this.getlist = [];       var list = this.hospitalLsit;       for (var i = 0; i < list.length; i++) {         if (list[i].hospital.indexOf(this.value) >= 0) {           this.getlist.push(list[i].hospital);         }       }       if (this.value == "") {         this.getlist = [];         this.getBeijing();       }     },     valueClear() {       this.getlist = [];       this.getBeijing();     }   } }; </script>
<style lang="less" scoped> .searchTop {   height: 52px;   background: #ffffff;   display: flex;   flex-direction: row;   align-items: center;   margin-left: 15px;   .text {     font-size: 14px;     font-family: PingFangSC, PingFangSC-Regular;     font-weight: 400;     color: #666666;     overflow: hidden;     white-space: nowrap;     text-overflow: ellipsis;   } } .black {   width: 6.5px;   height: 4.5px;   vertical-align: middle;   margin-left: 4px; } .tag {   width: 100vw;   height: 8px;   background: #f8f8f7; } .nameBox {   margin-left: 12px;   border-bottom: 1px solid #f0f0f0; } .name {   margin-top: 16px;   margin-bottom: 16px; } .disflex {   display: flex;   flex-direction: row;   align-items: center;   flex-grow: 1; } .vansearch {   flex-grow: 1; } </style>

标签：province,flex,一次,valParams,样式,hospital,getlist,flexgrow,hospitalLsit
来源： https://www.cnblogs.com/ylblogs/p/13710811.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。