标签归档:小程序

灵光一闪

灵感:币资产小程序/App

我最近在做 Crypto 投资,需要一个地方记录自己的持仓和涨跌等信息。因此,有了这个灵感。

这个小程序从整体的功能上,接近于有知有行的记账功能和且慢的且慢小账本。

应该具备以下功能:

  1. 对接 CMC or Crypto.com 的 API,实现币价实时获取
  2. 支持计算资产总额
  3. 支持多个钱包
  4. 支持展示图表
    1. 如持仓饼图
    2. 如价格走势图
  5. 支持初始化仓位的功能:我在使用非小号的记录的时候,最大的问题就是没有初始化仓位的能力,这对于已经有投资的人来说,比较麻烦。还要计算一下。
  6. 支持年度总结:大家肯定都有炫富的需求,还是可以搞一搞的
  7. 支持关注行情:这个需求存疑,我只是想到了。因为有可能我们做不到比金色财经更好,那就没啥意义了。
  8. 支持与其他公开的 ETF 对比收益率:满足炫富的心理,也可以让你了解到市场上的情况。
  9. 支持同步钱包的资产:可以让初始化更简单

键盘设置如何优化小程序使用体验?

在小程序开发过程中,用户输入是必不可少的,我们经常会需要用户输入一些内容,来完成产品收集用户信息的需求。

在这种情况下,我们可以考虑借助小程序提供的一些和键盘相关的 API 来优化小程序的使用体验。

Input 组件的 type 属性

Input 组件的 type 属性
Input 组件的 type 属性

从小程序的 1.0 版本开始,就支持为 input 组件设置 type,不同的 type 会显示不同的手机键盘。默认情况下,显示的是 text 文本输入键盘,这个键盘的特点是显示所有的内容,可以适用于所有的场景。

但,适用于所有场景也就意味着不适用于所有场景,总会在每一个场景中有着种种不便,因此,在实际的开发中,为了获得更佳的体验,你可以通过设置不同的 Type 来控制实际的键盘显示情况。

text 类型 input 适用建议
text 类型 input 适用建议

除了默认的 text 类以外,你还可以使用 number(数字输入键盘)、idcard 身份证输入键盘和 digit带小数点的数字键盘。

idcard 类型 input 适用建议
idcard 类型 input 适用建议

你可以根据自己的实际使用场景来设置不同的类型,比如说

  • 如果你的小程序的验证码都是数字的,那么你给出一个 text 类型的键盘,显然不如给一个 number 类型的键盘更合适。
  • 如果你的小程序中涉及到了手机号的输入,那么这种情况下你就可以选择使用 number 类型的键盘,来优化用户输入时的体验。
number 类型 input 适用建议
number 类型 input 适用建议

这里的思路是类似的,当你预期用户输入的内容只有数字,就可以考虑 numberdigitidcard等类型,来优化你的小程序的实际使用体验。

digit 类型 input 适用建议
digit 类型 input 适用建议

总结

input 组件默认提供的 四种 type ,可以通过选择不同的类型,从而获得不同的体验效果,从而对于你的小程序体验进行优化和推进。

小程序的 marker 无法触发 bindmarkertap 事件应该如何处理

TL;DR

如果想要 marker 可以响应 bindmarkertap 事件,需要设定 markerID,这一点文档中并没有标注。

具体情况

在开发美食地图时,出现了一个问题,marker 的点击总是不会触发 bindmarkertap 事件。

我的代码是这样写的

    store.get().then(res => {
      this.setData({
        stores: res.data,
        windowHeight: app.globalData.windowHeight,
      }, () => {
        wx.hideLoading();
        wx.showToast({
          title: '双指缩放可以调整地图可视区域,查看更多美食',
          icon: 'none'
        })
      })
    })

在地图中去调用 stores. marker

在地图上的确可以出现图标,但是无法点击 maker 并触发事件。

通过复制官方的 marker 的数据进行调试后发现,当 maker 有 id 时,marker 就可以触发事件,因此,怀疑是 ID 的问题。

在美食地图小程序中,我使用的是腾讯云提供的小程序·云开发,其使用的是 MongoDB 作为后台的 Database ,默认的主键为 _id,所以,我自己写了代码来转换 _id

      data.map(item => {
        item.id = item._id
      });

对应的 commit :https://github.com/CloudKits/miniprogram-foodmap/commit/5abcad1f756e03a388bb33dd1c699d3cae9ea0c4#diff-f5ea41cdd371d7b65bfdf8d32188e37d