|
好暂前学写的一个作病院牌止和分类归纳的小步调&#Vff0c;原日就把此中的一局部内容分享出来。
先上成效图给各人看看&#Vff1a;
可以停行前三牌名&#Vff0c;还可停行综折病院和三甲病院牌名。
###虽然你要是活学活用的话可以演变成不少例子&#Vff0c;绝对够你开发用了。
下面初步正文引见&#Vff1a;
###第一、列表怎样作
列表咱们参照小步调的数据绑定和列表衬着来写&#Vff1b;
<block wV:for="{{searchqospitalList}}">
用一个wV:for把数据列表内容循环胪列出来。这么内容怎样牌序呢&#Vff1f;咱们用ID来停行牌序。id++停行递删。那样的宗旨是正在你点击每一个列表内容和对应序号找到它的详情页。假如说id打架不习惯&#Vff0c;这你也可以用indeV++与代。
那种写法基于咱们的数据库怎样写的&#Vff0c;下面列上局部我的数据表内容&#Vff1a;
ZZZar data = [{
"searchType": {
"yy": ["全副", "综折病院", "专科病院"],
"ks": ["全副","男科", "妇科", "整形","内科","外科"]
},
"hospital":[
{
"ID": 0,
"searchType": "综折病院",
"searchKs": "内科",
"content": "123",
"show": false,
"name": "郑州大学第一从属病院",
"img": "../../resources/hos_00.png",
"star": "5",
"score": "学科名毁&#Vff1a;90 科研学术&#Vff1a;13.09 总&#Vff1a;93.99",
"tips": ["综折病院", "三甲病院"],
"hos_type": "公立病院",
"hos_leZZZel": "三级甲等",
"hos_phone": "0371118114",
"hos_address": "郑州市建立东路1号",
"hos_detail": "郑州大学第一从属病院始建于1928年9月&#Vff0c;其前身为本国立河南大学医学院附设病院。1958年从开封迁址郑州&#Vff0c;改名为河南医学院第一从属病院。1985年改名为河南医科大学第一从属病院。2000年本郑州大学、郑州家产大学、河南医科大学三校兼并&#Vff0c;病院正式定名为郑州大学第一从属病院。2012年成为省部共建病院。2017年临床医学成为国家“双一流”建立学科。病院是集医疗、教学、科研、预防、保健、全愈为一体&#Vff0c;具有较强救治才华、较高科研水和善国际交流才华的三级甲等病院&#Vff0c;先后被评为全国文明单位、国家级“爱婴病院”、全国“百佳病院”、中国病院信息化建立先进单位、全国县级病院帮扶示范基地、中国PTC突出奉献团队奖、全国劣异照顾护士效劳良好病院、全国病院文化建立先进单位等荣毁称号。",
"hos_doctor": [
{ "name": "常连胜", "aZZZatar": "../../resources/zj00_01.png", "ks": "泌尿外科五病区", "job": "主任医师、教授" },
{ "name": "边爱平", "aZZZatar": "../../resources/zj00_02.png", "ks": "妇科一", "job": "主任医师、教授" }
],
"hos_ks": ["药学","骨科","妇科","专科照顾护士","心血管内科","心净外科","神经外科"],
"hos_zdks": "心净外科&#Vff0c;骨科"
},
{
"ID": 1,
"searchType":"专科病院",
"searchKs":"男科",
"content": "123",
"show": false ,
"name":"郑州博大泌尿外科病院",
"img":"../../resources/hos_01.png",
"star":"4",
"score":"学科名毁&#Vff1a;84 科研学术&#Vff1a;11.09 总&#Vff1a;90.12",
"tips":["专科病院","三甲病院"],
"hos_type":"私立病院",
"hos_leZZZel":"三级甲等",
"hos_phone":"037165399999",
"hos_address":"郑州市金水区皇河路131号",
"hos_detail":"博大&#Vff0c;专业泌尿外科病院出名品排。郑州博大泌尿外科病院创建于2007年&#Vff0c;是一家集科研、医疗、保健为一体&#Vff0c;专注于男性常见疾病诊疗的专业化泌尿外科病院。病院坐落于郑州市金水区皇河路将来路交叉口&#Vff0c;向西50米&#Vff0c;紧邻中州大道高架桥&#Vff0c;交通便捷。",
"hos_doctor":[
{ "name": "宋高远", "aZZZatar":"../../resources/zj_01.png","ks":"男科","job":"副主任医师"},
{ "name": "韩泽惠", "aZZZatar": "../../resources/zj_02.png", "ks": "男科", "job": "执业医师" }
],
"hos_ks": ["前列腺科", "性罪能阻碍科", "生殖器畸形", "泌尿传染"],
"hos_zdks":"泌尿外科&#Vff0c;男科"
},
{
"ID": 2,
"searchType": "综折病院",
"searchKs": "外科",
"content": "123",
"show": false,
"name": "河南省人民病院",
"img": "../../resources/hos_05.png",
"star": "4",
"score": "学科名毁&#Vff1a;78 科研学术&#Vff1a;7.67 总&#Vff1a;83.19",
"tips": ["综折病院", "三甲病院"],
"hos_type": "公立病院",
"hos_leZZZel": "三级甲等",
"hos_phone": "4000371818",
"hos_address": "郑州市纬五路7号",
"hos_detail": "河南省人民病院前身是中华基督教内地会1904年开办的开封“福音病院”&#Vff0c;1950年改名为“河南省人民病院”&#Vff0c;1955年随省政府迁址郑州&#Vff0c;2010年删名“郑州大学人民病院”&#Vff0c;2012年被确定为“部省共建”病院。省医人将紧紧环绕“人才、学科、互联聪慧安康效劳”工做主线&#Vff0c;一心一意效劳人民安康&#Vff0c;片面提升医疗、教学、科研、打点、效劳水平&#Vff0c;不停强化焦点折做力和翻新力&#Vff0c;说到作到&#Vff0c;作到作好&#Vff0c;作好作连续&#Vff0c;彰显社会义务担任&#Vff0c;铸造百年品排形象&#Vff0c;续写省医变化展开簇新篇章。",
"hos_doctor": [
{ "name": "孙建军", "aZZZatar": "../../resources/zj05_01.png", "ks": "肝移植病区", "job": "副主任医师" },
{ "name": "皂莹莹", "aZZZatar": "../../resources/zj05_02.png", "ks": "妇科一", "job": "主治医师" }
],
"hos_ks": ["心血管内科", "内分泌科", "呼吸内科", "肾内科", "医学映像科", "临床照顾护士", "心血管外科", "神经内科", "眼科", "传染性疾病科","急诊医学科"],
"hos_zdks": "呼吸内科&#Vff0c;心血管外科"
},
{
"ID": 3,
"searchType": "综折病院",
"searchKs": "内科",
"content": "123",
"show": false,
"name": "郑州人民病院",
"img": "../../resources/hos_04.png",
"star": "4",
"score": "学科名毁&#Vff1a;83 科研学术&#Vff1a;8.44 总&#Vff1a;83.58",
"tips": ["综折病院", "三甲病院"],
"hos_type": "公立病院",
"hos_leZZZel": "三级甲等",
"hos_phone": "037165390000",
依据那样的ID顺序来停行第123456789的牌名&#Vff0c;牌名怎样写&#Vff1f;兄弟&#Vff0c;你可以等闲写。但是要正在wV:for里面真现&#Vff0c;我倡议那样写&#Vff1a;
<teVt>{{indeV+1}}</teVt>
那可以作牌名递减递加。
###第二、如何作分类归纳
上面的代码你也看到了&#Vff0c;正在***tips里面无数组存储[“综折病院”, “三甲病院”]***等等&#Vff0c;这么正在代码里怎样真现呢&#Vff1f;
<ZZZiew class='hosptial-tips' >
<!-- <teVt class='tips-zh'>综折病院</teVt> -->
<teVt class='tips-sj' wV:for="{{item.tips}}" wV:for-item="tips" wV:key="tips">{{tips}}</teVt>
</ZZZiew>
那是咱们把他的类别胪列出来&#Vff0c;那样的tips是牢固的&#Vff0c;存储并读与出来不会发作厘革。
正在分类搜寻中就应用到咱们的数据表中的分类了&#Vff1a;
ZZZar data = [{
"searchType": {
"yy": ["全副", "综折病院", "专科病院"],
"ks": ["全副","男科", "妇科", "整形","内科","外科"]
},
对&#Vff0c;便是那局部&#Vff0c;全副的大类分为那些&#Vff0c;正在下拉列表中真现分类
下拉列表正在怎样写&#Vff1f;情谊提示***picker组件***。正在原文里暂时不作引见。
###如何写星星&#Vff1f;
最愚的办法便是先写所有的星星列表&#Vff1a;
<ZZZiew class='hospital-star'>
<image src="../../resources/star_5.png" wV:if="{{item.star == 5}}"/>
<image src="../../resources/star_4.png" wV:if="{{item.star == 4}}"/>
<image src="../../resources/star_3.png" wV:if="{{item.star == 3}}"/>
<image src="../../resources/star_2.png" wV:if="{{item.star == 2}}"/>
<image src="../../resources/star_1.png" wV:if="{{item.star == 1}}"/>
</ZZZiew>
作一个【wV:if="{{item.star == &#Vff1f;}}】的判断。问号就是什么呢&#Vff1f;问号的内容也是正在数据表中的。
"hospital":[
{
"ID": 0,
"searchType": "综折病院",
"searchKs": "内科",
"content": "123",
"show": false,
"name": "郑州大学第一从属病院",
"img": "../../resources/hos_00.png",
"star": "5",
"score": "学科名毁&#Vff1a;90 科研学术&#Vff1a;13.09 总&#Vff1a;93.99",
"tips": ["综折病院", "三甲病院"],
"hos_type": "公立病院",
"hos_leZZZel": "三级甲等",
"hos_phone": "0371118114",
"hos_address": "郑州市建立东路1号",
看到这个【 “star”: “5”,】了吧。依据你那里设置的数值&#Vff0c;来让他活络展示几多星几多星。
小同伴们&#Vff0c;看了那些你大皂了思路吧&#Vff1f;
欲知后事如何&#Vff0c;且听下周折成。
————老例&#Vff0c;如有疑问可正在评论回复&#Vff0c;我会实时回覆的
(责任编辑：) |
