uni-app 有没有大神贡献一个医疗的项目模板

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app 有没有大神贡献一个医疗的项目模板

1 回复

当然,为了提供一个基础的医疗项目模板示例,我们可以创建一个简单的uni-app项目结构,并包含一些基本的医疗相关页面和功能。以下是一个简化的代码案例,展示了如何使用uni-app搭建一个医疗项目的基础模板。

项目结构

my-medical-app/
├── pages/
│   ├── index/
│   │   ├── index.vue
│   ├── doctorList/
│   │   ├── doctorList.vue
│   ├── patientProfile/
│       ├── patientProfile.vue
├── static/
│   ├── logo.png
├── App.vue
├── main.js
├── manifest.json
├── pages.json
└── uni.scss

main.js

import Vue from 'vue'
import App from './App'
import store from './store'

Vue.config.productionTip = false

App.mpType = 'app'

const app = new Vue({
    store,
    ...App
})
app.$mount()

pages.json

{
    "pages": [
        {
            "path": "pages/index/index",
            "style": {
                "navigationBarTitleText": "首页"
            }
        },
        {
            "path": "pages/doctorList/doctorList",
            "style": {
                "navigationBarTitleText": "医生列表"
            }
        },
        {
            "path": "pages/patientProfile/patientProfile",
            "style": {
                "navigationBarTitleText": "患者档案"
            }
        }
    ],
    "window": {
        "backgroundTextStyle": "light",
        "navigationBarBackgroundColor": "#fff",
        "navigationBarTitleText": "医疗App",
        "navigationBarTextStyle": "black"
    }
}

pages/index/index.vue

<template>
  <view class="content">
    <image class="logo" src="/static/logo.png"></image>
    <navigator url="/pages/doctorList/doctorList">查看医生列表</navigator>
    <navigator url="/pages/patientProfile/patientProfile">查看患者档案</navigator>
  </view>
</template>

<script>
export default {
  data() {
    return {}
  }
}
</script>

<style>
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
.logo {
  width: 100px;
  height: 100px;
}
</style>

pages/doctorList/doctorList.vuepages/patientProfile/patientProfile.vue

这些页面可以类似地创建,分别展示医生列表和患者档案信息。你可以使用uni-app提供的API进行网络请求,获取并展示数据。

这个模板提供了一个基本的项目结构和几个页面示例。你可以根据需要进一步扩展,比如添加登录功能、数据持久化、更多页面和功能等。希望这个示例能帮你快速上手uni-app医疗项目的开发。

回到顶部