• 简书网微信公众号二维码
您当前的位置: 首页 > 知识百科 > 小程序店铺名片怎么生成?

小程序店铺名片怎么生成?

时间:2023-07-01 14:05 阅读数:84 人阅读 分类:知识百科

  小程序店铺名片怎么生成?相信很多的微信用户都清楚,我们在给微信好友推荐某一个人的时候,可以发送微信名片,小程序店铺名片也是如此哦,如果开发出来了,就会更加容易的分享了。

  小程序店铺名片怎么生成?

  首先跳转到我们的新增小程序店铺名片的页面。

  

  需要传递用户的当前 userId,wx.navigateTo 带值跳转。Manual 为 true 设置用户走的是新增路线。

  

  新增名片页面 1基本布局如下:

  

  取到 userId。

  

  使用微信小程序自带的 input 组件验证也非常好用,如 maxLength 属*,可以限制用户输入长度,如我这的姓名长度是最大 5 位,直接数字 5 即可。

  

  也可以自定义一些微信验证效果,具体可以根据需求进行一些验证配置,取到用户输入的值,进行操作。

  

  这里绑定了自带的模态框提示组件。

  其中 modalHidden2 是模态框开关。

  另外 proptText 是需要提示的内容。

  即使很多小程序输入框也支持数据动态改变,非常方便。

  

  实际效果,非常快捷,比以前省去很多事情,编写微信小程序,发现最大的好处可能就是我们不必去考虑一系列兼容*问题。

  最后还有个微信小程序上传图片,测试了下目前上传到后台服务器还有点问题,应该是内测版本不太完善导致吧。

  

  设置的直接是背景图片。

  提交表单与跳转。

  提交表单使用的是自带的 bindsubmit 事件小程序组件,在 button 组件上添加 formType=”submit” 即可,还有点需注意的是使用表单提交功能时 input 需加上 name 属*,这个传递方式是以键值对的形式传递的。

  这时候跳转到编辑页 2 页面,这个页面是根据用户填写的手机号码识别到匹配的公司,页面非常简单,一个数据循环而已,单选框日后可能还需要美化一下。

  同样也是一些数据绑定以及验证效果。

  实际渲染效果可以看到。

  

  这个和第一个编辑页面逻辑基本不相上下,一些基本验证与提交,这里就讲到前面两步骤即可,编辑页面3也是同理,这里不再过多啰嗦。

  姓名手机必填模块。

  个人信息模块,直接循环(block)出来。

  Onload 时我们请求必填与选填数据:

  requiredGroup 必填中文信息

  notRequiredGroup 选题中文信息

  requiredGroupEn 必填英文信息

  notRequiredGroupEn 选题英文信息

  //请求名片对应的公司的中文信息的属*组数据,分为必填和选填

  //选题项变量以no开头

  requester.getOfflineCardInfoGroupFields(userId, cardId,

  function (res) {

  //debugger

  var userName = res.card.userName;

  var mobile = res.card.mobile;

  var requiredGroup = res.requiredGroupCh;

  var notRequiredGroup = res.notRequiredGroupCh;

  var requiredGroupEn = res.requiredGroupEn;

  var notRequiredGroupEn = res.notRequiredGroupEn;

  var reqLen = requiredGroup.fields.length;

  var nreqLen = notRequiredGroup.fields.length;

  var reqLenEn = requiredGroupEn.fields.length;

  var nreqLenEn = notRequiredGroupEn.fields.length;

  self.setData({

  userName: userName,

  mobile: mobile,

  requireFields: requiredGroup.fields,

  notRequireFields: notRequiredGroup.fields,

  requireFieldsEn: requiredGroupEn.fields,

  notRequireFieldsEn: notRequiredGroupEn.fields,

  l1: reqLen,

  l2: nreqLen + reqLen,

  l3: reqLenEn + nreqLen + reqLen

  });

  self.forceUpdate();

  }, function (code, msg) {

  console.info("code=" + code + "&msg=" + msg);

  });

  以上便是小程序店铺名片怎么生成的操作方法了,大家看完都学会了吗?通过以上的小程序店铺名片生成步骤可以去制作出你的小程序店铺名片哦。想要了解关于更多小程序知识,敬请关注微小乔。

相关推荐:

开发微信小程序名片源码

微信小程序名片怎么弄?小程序名片制作教程

我的微信小程序名片怎么弄?