Taro多端口小程序开发注意事项

最近，Taro开发了一个多端小程序。该项目主要是面向B端企业的商务旅行产品。首先，小程序和H5将占上风。稍后，它将适应各种平台。以下是我在项目中遇到的一些问题。我希望他们能帮助你。

问题：当H5平台适用于下拉刷新时，如果页面中有固定元素，当元素无法达到页面高度时，它们将被错位。分析：小程序平台优化了自己的组件，而浏览器是开放的。

解决方案：将首页的最小高度设置为屏幕。

问题：不同平台的API相似，可以很好地适应，但H5根本不支持它们。如果使用它们，将报告错误。分析：小程序是平台，H5是浏览器

解决方案：当使用具有平台功能的API时，增加平台判断。相关API：process.env。塔罗环境

问题：当小程序（如nail）使用Redux状态管理时，它们不能存储太大的数据。目前，全国城市的列表界面是已知的，超过3000条数据将报告错误分析：由于数据太大，小程序会认为预期结果会受到影响，因此会抛出错误

解决方案：不需要共享数据，避免使用redux

问题：当小程序为“2021-12-30”格式的日期到字符时间戳时，开发预览环境正常，但IOS设备将显示NaN分析：IOS设备不支持带“-”的日期格式

解决方案：将日期从2021 12月30日更改为2021 12月30。代码：replace（/-/g，'/'）

问题：当钉钉小程序执行请求时，如果数据格式为number，它将抛出参数错误异常并停止发送请求分析：H5不存在此问题，这是钉钉请求SDK的一个特性。当传递的参数格式不是｛｝时，将确定您的参数是错误的

解决方案：数据参数格式应写成｛｝。如果它只是基本数据类型的参数，则应将其写入路径中，而不是作为数据传递。

问题：固定小程序的taro复选框组件中莫名其妙地出现了两个边框，但无法找到样式。经过检查，发现元素在分析前后设置了伪元素：元素设置了伪元件样式，钉扎小程序的开发工具不支持调试伪元件

解决方案：首先避免编写伪元素，然后在平台兼容后使用它们。

问题：当H5使用taro ui的范围选择器组件时，如果有两个相邻页面可用，该组件将在切换到第二个页面时失败，并且刷新将正常执行。因为当成员使用这个组件时，他们使用类名设置distribute:none来控制它。上一页的dom元素仍在正文中，而该组件的宽度是通过H5中的类名获得的。因此，第一个类名没有宽度，这将导致宽度为0，从而定位失败

解决方案：此组件库确实存在问题。它与H5平台不兼容。最后，我自己安装了这个组件并修复了这个bug。然后，我控制是否通过jsx三元运算符渲染它。