你敢说小程序开发的六大技巧你哪一个都不会用？

更改小程序原生组件的大小

微信官方提供了一些基础组件，但有些组件并没有提供类似于大小的属性。我们只需要一个css就可以解决这个问题。以收音机为例：

小程序picker组件的范围输入不生效 [Object Object]完成，先阅读文档：

使用场景是传入组件为对象数组时，需要设置range-key来设置数组中的哪个值显示为列表显示内容

根据官方文档，问题出在range key的类型上，因为在{{}}中使用了对应的数据，这意味着传递给组件的不是字符串值。正确的使用方法是：

使用单引号将范围key包裹起来，或者直接使用昵称而不是{{}}

小程序更改单个值。页面背景颜色

设置小程序的页面背景颜色。一开始设置了一个全局背景色，在app.json的Windows对象中设置

后来页面第一反应是使用单独的json文件设置，

果断发现是没用，页面背景还是灰色的：

解决办法，在对应的wxss文件中设置一个页面类：

小程序路由参数，传对象参数

小程序中传参的方法是拼接网址后面。通常只需要绑定参数id，将id绑定到{{item.id}}，并在点击事件中使用event.currentTarget。接受

但如果确实想以对象的形式传递参数，尤其是父子对象，可以将对象转为json字符串后再传输

但由于URL长度有限，对象太长，结果发现后面URL中的拼接会不完整，导致后面无法解析，所以重做参数对象的时候要小心，参数对象不能太长。

接收方式：

小程序自主设置具体属性值​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​+小程序来回答，this.setData()方法，那么假设我有一个这样的数据：

我只是想给地址赋值地址数据的属性。我应该怎么办？也许你会这样：

不不，你不需要这样，你只要这样：

就这么简单，如果你以前没有用过，你一定要这样非常兴奋，别担心，我们会将问题升级！假设我当前的数据是这样的：

现在我们只想将 DiscountList 数组中所选对象的点击值更改为 1，该怎么办？

不不，你会发现这是不可能的，我教你一个简单的方法：

但是！每次都定义变量看起来很烦人！所以一定会更容易！多么容易啊！

昵称数据中包含的洗牌表情符号（如表情符号）会在小程序接口加密时被删除

您是否遇到过通过接口发送可以在后台看到每个用户的微信昵称，却随机报错……天啊，因为每个接口都要MD5加密，所以接收到的用户昵称也要加密并发送给后端。起初我无意中拿走了它并把它扔掉进行加密。直到后台人员用微信测试了一下，中文签名验证失败。 ，几周前调整了中文签名验证的签名算法，后来发现了…

他的微信昵称里有3个“屁”….

你打开你的你发现它emoji输入法中都是不同的表情，包括一个屁……所以我想到的方法就是先把特殊符号去掉，换成指定的符号，然后扔进去加密。代码：

至于为什么我的第一反应不是删除特殊短语，而是删除它们。然后我想，如果还有人只用特殊表达作为昵称...那么空字符串就会被保存起来，到时候就会显示出来。它是空的，视觉上看起来不太好。？看来，有时为了页面的整洁，所以……杀掉它！

小程序跳转，写绝对路径

忘记为什么用了。无论如何，我终于想通了。路径拼接以“/”开头，你总会用到

小程序多行文本溢出显示省略号

这个问题其实不大，但是花了一段时间才解决。主要有两个原因：

1. 起初我考虑在省略号上使用单行：
   

这是单行文本。一开始我以为是加了固定高度后，后来发现是设备像素问题。有些设备会覆盖该行的一半。我突然觉得有些不对劲，不应该这样做。

1. 我被设备像素问题愚弄了，所以我去看看不同设备中行高是否有变化。后来我要求的多行注释文本中，用伪类太难了，于是我找到了一种样式：
   

这种类型css只适用于webkit和移动端，所以可以完美的用在小程序中，但是切记不要设置固定的高度！ ！

设置小程序页面的页面高度为100%

放置代码：

关键代码是设置父元素位置：固定；高度：100%；宽度：100%；注意里面的子元素不要使用fixed，使用absolute来根据父元素定位

小程序的点击事件阻止冒泡处理

这时候就会出现一种情况。当我点击视图时，它会跳转到指定的页面。如果我点击视图中的图像的话，它会跳转两次到指定的页面。他的第一反应是当年做的第一个前端项目中产生的新知识和新事件。

解决方案：

在小程序中，事件分为冒泡事件和非冒泡事件：

冒泡事件：当组件上触发事件时，该事件会传递给父组件。非冒泡事件：当组件上触发事件时，该事件不会传递到父组件。

有一行单独解释：

bind事件绑定不会阻止冒泡事件向上冒泡，而catch事件绑定可以阻止冒泡事件向上冒泡。

小程序地图组件不显示坐标，出现Bing地图标志

Map地图组件使用情况：

使用地图时出现问题。在onload方法中调用了该接口，将数据中的lng给lat赋值后，发现地图当前显示的地图是空的，没有坐标，下方出现Bing Map标志。我立刻就糊涂了。难道地图组件没有使用腾讯地图的坐标？它们是 Bing 地图的坐标吗？你不会这么肆无忌惮吗...

后来研究发现，地图组件的组件渲染优先于setData接口的异步分配。结果，在地图的渲染过程中，经度和纬度值实际上是空的，地图只渲染了一次。

最后的保存方式是使用wx:if

初始化mapOn为false，将lng和lat赋给界面后将mapOn设置为true，渲染地图！

小程序按钮点击css效果

小程序自带的按钮组件是有点击效果的，但是当你自定义类的时候，你会发现它只是一个盒子，在你点击的时候它就静静地呆在那里点击它。视觉点击感觉…大多数情况下，我们需要自己定义按钮样式，所以我们写了一系列通用的小程序来点击按钮效果

终于不再那么生硬了…

作者：长小胖
来源：掘金队