如何在小程序里边实现表单录入信息的设置?

如何在小程序里边实现表单录入信息的设置?,第1张

效果展示

通过使用输入框组件、按钮组件,同时配合事件中心的创建事件,实现表单录入数据信息。

创建数据表

注意:在数据中心你可以创建属于自己应用程序的数据表格,数据表格类型分为用户表、商品表、订单表和自定义表。

点击数据中心,创建数据表。

包含字段:姓名(文本类型)、手机号(文本类型)、预计来访日期(日期类型)。

创建事件

注意:事件是构建数据与界面元素组件链接的抽象逻辑,数据表与界面元素组件通过事件连接。

点击事件中心。

创建提交信息事件。

触发器配置

注意:在检查器面板中的触发器设置面板创建触发器,可以对组件进行交互逻辑设置,或配合事件来进行动态数据 *** 作。

选中提交按钮。

点击检查面板中的触发器。

创建触发器。

创建提交信息触发器。

选中图标。

点击检查面板中的触发器。

创建触发器。

选中数据选择器。

点击检查面板中的触发器。

创建触发器。

创建触发器。

目前总结解决方法:同时需要设置模块的函数,函数都可放置在util.js中去。

首先:

一、在util.js中放入如下两组函数

1. 设置点击后多久不能再次 *** 作该

function throttle(fn, gapTime) {

  if (gapTime == null || gapTime == undefined) {

    gapTime = 1500

  }

  let _lastTime = null

  // 返回新的函数

  return function () {

    let _nowTime = + new Date()

    if (_nowTime - _lastTime >gapTime || !_lastTime) {

      fn.apply(this, arguments)  //将this和参数传给原函数

      _lastTime = _nowTime

    }

  }

}

2. 设置加载动画

function showLoading(message) {

  if (wx.showLoading) {    // 基础库 1.1.0 微信6.5.6版本开始支持,低版本需做兼容处理

    wx.showLoading({

      title: message, mask: true

    })

  } else {    // 低版本采用Toast兼容处理并将时间设为20秒以免自动消失

    wx.showToast({

      title: message, icon: 'loading', mask: true, duration: 20000

    })

  }

}

function hideLoading() {

  if (wx.hideLoading) {    // 基础库 1.1.0 微信6.5.6版本开始支持,低版本需做兼容处理

    wx.hideLoading()

  } else {

    wx.hideToast()

  }

}

并且将其导出作为页面使用:

module.exports = {

  throttle: throttle,

  showLoading: showLoading,

  hideLoading: hideLoading,

}

二、将函数引入页面使用

const util = require('../../utils/util.js')

即可。

Hi,大家好!表姐又来给大家答疑解惑啦!

Q

如何查看自己提交的数据?

A

可以通过 公开查询 及 小程序中填写 查看已提交的数据。

  01. 公开查询  

选择 表单>>设置>>公开查询 ,勾选 “允许未登录用户查询数据” ,设置查询条件,例如活动报名表,填表人输入自己的姓名、手机号即可查询自己提交的信息啦。表单大师公开查询功能不仅可以实现对外查询,还可以满足填表人自助修改已提交数据、自助打印等场景,很强大的哦。更多用法,点击了解: 公开查询

  设置页面:

☞ 点击体验 ☜

Tips: 将公开查询链接地址放到自己的微信公众号菜单栏,就是一个用户自助查询入口啦。

  02. 小程序中填写  

制作好表单后,进入 表单发布页面 ,获取 表单小程序码 。将小程序码发给填表人,即实现填表人在小程序中填写表单。这样微信中进入表单大师小程序,选择 “我参加的” ,再选中表单名称,即可进入 “我提交的数据” 页面,就可以看到自己提交的数据啦。

获取表单小程序码

小程序查看自己提交的数据

当然,你也可以直接在表单大师小程序中创建表单,然后分享给填表人填写。

小程序分享表单

▼ 更多问题咨询客服 ▼

不要惊讶,是真人!


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/11467948.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-16
下一篇 2023-05-16

发表评论

登录后才能评论

评论列表(0条)

保存