重磅：微信小程序发布WeUI.js 官方视觉组件库！

12月16日，微信正式发布了WeUIjs动态视觉组件库。WeUI是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，可以让用户的使用感知更加统一。WeUIjs动态视觉组件库包含了button、cell、dialog、progress、toast、article、actionsheet、icon等各式元素。

一、weuijs是什么？

weuijs是WeUI的轻量级JS封装，不需要依赖其它库，GZIP后仅有90 KB。

二、weuijs包含哪些组件？

actionsheet

alert

confirm

dialog

form

gallery

loading

picker

searchbar

slider

tab

toast

toptips

uploader

三、使用方式：

Github：>

view标签 加 bindtap事件，用data-name传值，如果view中只有文字，点击整个view区域都可以接收到data-name的值，如果view里面加一个lable标签，那么点击lable包裹的区域，data-name取不到值。

解决方法：把取值方式 由etargetdatasetcarrierName 修改为ecurrentTargetdatasetcarrierName即可！

场景：画图应用需选择画笔颜色，有4种颜色按钮可供选择，用户点击任意按钮进行颜色切换。

思路：通过curColorIndex变量保存当前选中的颜色下标，选中后添加额外的选中样式

一，canvaswxss文件：这个文件用于定义按钮正常态和选中态的样式，以及Flex

布局的约束

二，canvaswxml文件：这个文件是Demo的布局界面，通过使用js的data数据和wxss的class样式进行页面布局

这里通过wx：for实现循环打印颜色数组，通过curColorIndex值控制选中的样式，index值进行参数传递

三，canvasjs文件：提供数据，以及处理xwml的控件响应，并通过设置thissetData的值来更新xwml的显示

原文地址： >

以上就是关于重磅：微信小程序发布WeUI.js 官方视觉组件库！全部的内容，包括:重磅：微信小程序发布WeUI.js 官方视觉组件库！、微信小程序地图描边怎么设置、微信小程序地图控件怎么绑定事件等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！