1.月见项目

月见是通过展示走失人物信息的微信小程序，主要通过不同省份展示信息、姓名搜索查询的方式展示走失人物信息。由于时间有限，这只是一个最简单的Demo，后续也会进行优化。

2.应用场景

设想获取各大网站的走失人物信息展示于小程序上，提供给各大需要找寻已走失人的用户一个更加方便的平台。

3.目标用户

主要目标用户为有走失亲人、朋友的用户，提供一个简单走失人物信息展示。

4.实现思路

通过获取其它网站的走失人物信息，储存于小程序云开发平台，再由小程序云开发的方式展示信息。小程序端采用的组件化开发方式，减少单个文件太过于紧凑的情况，也提高了组件的可复用性。后端则是使用云函数获取云数据库的数据。

5.架构图

6.效果截图

• 首页

• 切换省份

• 搜索页面

• 搜索结果页面

• 查看详情

• 我的页面

7.功能代码展示

home.wxml

姓名搜索

home.js

import {random} from '../../util/common.js'
import {Area} from "../../models/area";
import {Banner} from "../../models/banner";
import {Lost} from '../../models/lost.js';

Page({
  data: {
    banners: [],
    losts: [],
    searching: false,
    more: '',
    selectArea: []
  },

  async onLoad (options) {
    this.initArea()
    this.initBanner()
    this.initLostData()
  },

  async initLostData() {
    let area = Area.getSelectArea()
    this._searchArea(area)
  },

  async initBanner() {
    let banners = await Banner.getBanner()
    this.setData({
      banners
    })
  },

  async initArea() {
    let area = Area.getLocal()
    if(!area) {
      area = await Area.getArea()
    }
    this.setData({
      selectArea: area
    })
  },

  async _searchArea(area) {
    let losts = []
    if(area === null || area === "全部") {
      losts = await Lost.listLost(0, false)
    } else {
      losts = await Lost.listLost(0, area)
    }
    this.setData({
      losts
    })
  },

  async onSelectArea(event) {
    let selectArea = event.detail.name
    Area.setSelectArea(selectArea)
    this._searchArea(selectArea)
  },

  onSearching() {
    this.setData({
      searching: true
    })
  },

  onCancel() {
    this.setData({
      searching: false
    })
  },

  //随机字符串保证每次触底会改变组件中more属性值
  async onReachBottom() {
    this.setData({
      more: random(16)
    })
    let losts = []
    let start = this.data.losts.length
    let area = Area.getSelectArea()
    if(area === null || area === "全部") {
      losts = await Lost.listLost(start, false)
    } else {
      losts = await Lost.listLost(start, area)
    }
    this.setData({
      losts: this.data.losts.concat(losts)
    })
  },
})

8.作品体验二维码

小程序已上线，搜索月见之时即可

9.小程序Github源码地址

https://github.com/Zeffon/mini-ep

10.小程序介绍视频地址

https://v.qq.com/x/page/z3151wrfguo.html

11.团队简介

月见团队由广东技术师范大学天河学院计算机科学与工程学院的两名学生组成：

吴泽锋：软件工程大四学生，负责小程序的前后端开发

陈金生：软件工程大四学生，负责数据的获取、数据库开发