用云开发快速制作客户业务需求收集小程序丨实战

本文链接：https://blog.csdn.net/TCB_CloudBase/article/details/103178651

本文介绍了一种使用小程序云开发快速构建客户业务需求收集平台的方法，通过云数据库存储表单信息和云存储处理上传文件，简化了传统上门收集的需求流程。文章详细阐述了开发过程，包括WeUI组件的应用，以及云数据库和云存储的实现代码。同时，作者提出了一些待优化的方面，如增加验证和订阅消息功能，以提升用户体验和数据安全性。

摘要由CSDN通过智能技术生成

一、导语

如何省去企业上门（现场）搜集客户需求的环节，节约企业人力和时间成本，将客户的业务定制需求直接上传至云数据库？云开发为我们提供了这个便利！

二、需求背景

作为一名XX公司IT萌萌新，这段时间对小程序开发一直有非常浓厚的兴趣，并且感慨于“云开发·不止于快”的境界。近期工作中，刚好碰见业务部门的一个需求，目的是节约上门跟客户收集业务定制资料的时间，以往是每变更一次，就需要上门一次，碰见地域较远的，费时费力，且往往要求几天内完成上线，时间非常紧迫。因此，结合一直以来对云开发的各种优势的了解，我说服公司领导通过小程序·云开发来实现。

下面是其中一项业务定制界面的展示：
（1）业务对业务流程有简单说明；
（2）相关业务介绍；
（3）不同客户输入个性化需求；
（4）云存储后台实现需求表单的收集。

在这里插入图片描述
得力于云开发提供的API和WeUI库的便利，本项目在我在极短的时间内就实现了比较理想的效果。接下来，我就从本项目入手，讲讲我是如何依靠小程序·云开发将想法快速实现的，其实我也是刚入门没多久，只是想分享一下自身在学习小程序开发项目中的一些知识点和体会，代码可能略为粗糙，逻辑也有待优化，欢迎大家在评论区多多交流。

三、开发过程

1、组件

主要使用了官方WeUI扩展能力的一些组件库来实现主要功能。

核心的WeUI库主要有 Msg、Picker、图片的Upload等（以快为目的，节省自己写CSS样式的时间，也方便0基础的同学上手，这里又体会到了小程序开发的便捷）。
在这里插入图片描述

2、实现代码

本次云开发包括云数据库、云存储两大功能：

（1）云数据库

云数据库的主要就是搜集客户提交上来的表单信息，包括客户的联系方式和选择的业务类型等，并存储在云数据库中，方便业务经理搜集需求。

在这里插入图片描述
我们来看简单的实现过程：

首先是表单，用到了 form 表单组件以及它的 bindsubmit 方法，在 wxml 中放置 form 表单：

<form bindsubmit="formSubmit">
    <view class="form">
      <view class="section">
        <picker bindchange="bindPickerGsd" mode="selector" value="{
   {indexGsd}}" range="{
   {arrayGsd}}">
          <view class="picker">归属县市</view>
          <view class="picker-content" >{
   {
   arrayGsd[indexGsd]?arrayGsd[indexGsd]:"(必填项) 请下拉选择归属地"}}</view> 
        <