Weapp Issue

Now you can provide attr wx:key for a wx:for to improve performance

当我们在使用wx:for遍历列表数据的时候，原则上来讲每条数据都是不一样的，所以需要使用 wx:key来指定列表中项目的唯一的标识符

解决：在所有的wx:for处理添加wx:key="id"

<block wx:for="{{projectList}}" wx:key="id">

如果添加成：wx:key="{{item.id}}"还会报错。

<block wx:for="{{projectList}}" wx:key="{{item.id}}">

wx:key="{{item.id}}" does not look like a valid key name (did you mean wx:key="id" ?)

微信小程序在循环元素中 bindtap data-argument 获取不到参数

<view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view>

var hi = event.target.dataset.hi;

但是在循环中，上述方式是拿不到数据的。

<view id="tapTest" data-hi="{{item.hi}}" bindtap="tapName" wx:for="{{list}}" wx:item="{{item}}"> Click me! </view>

需要：var hi = event.currentTarget.dataset.hi;

target 触发事件的源组件。 currentTarget 事件绑定的当前组件。

微信小程序_bindtap获取不到参数_data-hi-CSDN博客

微信小程序（五）bindtap事件传递当前循环到的对象_微信小程序 循环点击传值传对象_jonssonyan的博客-CSDN博客

小程序（十一）小程序bindtap传参_小程序 bindtap 传参-CSDN博客

view hidden属性使用示例

但没有 show 属性

<view hidden="{{!statusTag}}">我出来了~</view>

wx:if vs hidden

因为 wx:if 之中的模板也可能包含数据绑定，所以当 wx:if 的条件值切换时，框架有一个局部渲染的过程，因为它会确保条件块在切换时销毁或重新渲染。 同时 wx:if 也是惰性的，如果在初始渲染条件为 false，框架什么也不做，在条件第一次变成真的时候才开始局部渲染。 相比之下，hidden 就简单的多，组件始终会被渲染，只是简单的控制显示与隐藏。 一般来说，wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此，如果需要频繁切换的情景下，用 hidden 更好，如果在运行时条件不大可能改变则 wx:if 较好。

【hidden】微信小程序hidden属性使用示例_微信小程序hidden的用法-CSDN博客

微信小程序小知识-hidden隐藏显示 - 知乎

应用示例

echarts层级太高，遮挡van-popup弹框组件

微信小程序：echarts层级太高，遮挡van-popup弹框组件

1、使用hidden

注意，不能直接加在组件上，需要外层包裹一个view

<view hidden="{{hiddenChart}}">

    <echart></echart> 
</view>

微信小程序：echarts层级太高，遮挡van-popup弹框组件van-popup弹窗被van-circle遮挡彭世瑜的博客-CSDN博客

微信小程序原生和VantUI都没有找到table表格组件

？？？

小程序下拉刷新、加载更多及数据分页

小程序下拉刷新、加载更多及数据分页 - 掘金

微信小程序开发--上拉加载更多(分页加载) - 掘金

在微信小程序中使用 ECharts

echarts来自BAT中的B前端团队，对应的小程序版本为：echarts-for-weixin

echarts-for-weixin 项目提供了一个小程序组件，用这种方式可以方便地使用 ECharts。

微信小程序 - 跨平台方案 - 应用篇 - Handbook - Apache ECharts

ecomfe/echarts-for-weixin: Apache ECharts 的微信小程序版本

示例

echarts-for-weixin/pages/line/index.js at master · ecomfe/echarts-for-weixin

apache/echarts-examples: Examples of Apache ECharts

Documentation - Apache ECharts

其他参考

Echarts 在 Vue 中的最佳实践 - 掘金

散点图

ElemeFE/v-charts: 基于 Vue2.0 和 ECharts 封装的图表组件📈📊

xiaolin3303/wx-charts: 微信小程序图表charts组件，Charts for WeChat Mini Program

语雀，支付宝匠心打造的在线文档平台

AntV | 蚂蚁数据可视化

报错：未找到 van-toast 节点，请确认 selector 及 context 是否正确

需要在wxml中添加标签

<van-toast id="van-toast" />标签

传入context: this即可。

Toast({message: 'xxxx', context: this});

未找到 van-toast 节点，请确认 selector 及 context 是否正确-CSDN博客

vant Weapp中 Cell单元格修改样式

• van-cell 组件，van-celltitle和van-cellvalue的宽度无法修改

添加custom-class和!important

vant Weapp中 Cell单元格修改样式_孤独的马铃薯的博客-CSDN博客

Vant cell 自定义title和value宽度(van-cell宽度问题) - 掘金

更新已有icomoon图标

须要本地icomoon文件夹中的selection .json文件。

个人笔记|前端项目中icomoon图标使用 - 简书

IcoMoon App - Icon Font, SVG, PDF & PNG Generator

Online @font-face generator — Transfonter

其他参考

字体图标库——icomoon的详细使用教程 - 掘金

IcoMoon | 强悍的 WEB 字体图标制造器 | Boss设计

让微信小程序使用base64字体图标icomoon - 简书

微信小程序this.setData不渲染问题

关于微信小程序this.setData不渲染问题_蛋蛋糊涂的博客-CSDN博客

Setting data field "xxxx" to undefined is invalid

比如：Setting data field "today_alarm_count" to undefined is invalid

这是因为使用this.setData赋值时，所赋的值是undefined

this.setData({
    today_alarm_count: today_alarm_count
})

微信小程序 - [警告] Setting data field "xxxx" to undefined is invalid. 解决方案-CSDN博客

点击事件的对象循环须用currentTarget e.target.dataset

不在wx:for循环中，使用e.target.dataset

<block wx:for="{{change_function}}" wx:key="id">
<view class="c_card df jc-between ai-center" wx:key="{{item.id}}">
    {{item.name}}
    <view class="df jc-center ai-center">
    <van-switch size="15px" checked="{{ item.show }}" active-value="{{1}}" inactive-value="{{0}}" bind:change="onCustomSensor" data-item="{{item}}" style="display:flex;" />
    </view>
</view>
</block>

let {
    item
} = e.currentTarget.dataset // 循环须用currentTarget e.target.dataset