微信小程序开发中常见问题的解决

在微信小程序的开发过程中，会遇到各式各样的问题，本文主要是针对自己开发中遇到的问题，找到解决方案后的记录总结。

1.控件中同时使用wx:if和wx:for导致无效的问题

这个问题是一个朋友问到的，场景是一个类似微信朋友圈的列表数据，通过服务器的一个参数控制条目中图片的显示隐藏，比如当前的朋友圈动态是有图片的，则该条目的isShow为true，反之，则isShow为false。布局的方式是大的列表数据嵌套小的图片列表数据，在实现的时候通过wx:if来控制图片列表的显示隐藏，通过wx:for来控制图片列表数据的显示，逻辑结构很简单，但是在图片列表控件上同时添加wx:if和wx:for时，发现wx:if不起作用。图片列表代码如下：

<block class="imglist" wx:if="{{item.isShow}}" wx:for="{{item.piclists}}">
   <image class='image-view' src="{{item.pic}}"></image>
</block>

看到这个问题，也很奇怪，逻辑上没有什么问题，然后开始动手做测试，测试过程中发现：如果对同一个控件同时添加wx:if和wx:for，是不能正常起作用的。修改代码，在图片列表控件外添加一个view布局，来单独控制其显示隐藏。修改后代码如下：

<view wx:if="{{item.isShow}}">
    <block class="imglist" wx:for="{{item.piclists}}">
       <image class='image-view' src="{{item.pic}}"></image>
    </block>
</view>

2.微信实现不同分享按钮分享不同内容

在小程序的开发过程中，分享是很重要的功能点，之前的文章也介绍了：微信小程序不同分享效果的实现，有时候可能需要我们实现不同的按钮分享不同的内容，这一点我们应该如何去实现呢？
先看下官方文档关于分享的说明：
这里写图片描述
其中options参数中有两个参数from和target，from用来区分分享的来源，确定是按钮分享还是右上角分享，target参数则是按钮分享的触发控件。
首先，我们创建一个分享按钮：

<button id='123' class='starshare' open-type='share'>
    <text class='sharemsg'>分享</text>
</button>

在js文件中实现onShareAppMessage()方法：

onShareAppMessage: function (options) {
    console.log(options)
}

在分享方法中打印一下options的值，当我们点击分享按钮时，结果如下：
这里写图片描述
在target参数中返回了当前控件的id值，然后，我们就可以通过id值的不同，来区分不同按钮的转发。
后续持续更新，如有问题，欢迎留言。