1. 按钮（Button）：
<button class="weui-btn weui-btn_primary">主要按钮</button>
<button class="weui-btn weui-btn_default">默认按钮</button>
2. 列表（List）：
<view class="weui-cells">
<view class="weui-cell weui-cell_access">
<view class="weui-cell__bd">列表项</view>
<view class="weui-cell__ft">说明文字</view>
</view>
</view>
3. 表单（Form）：
<form class="weui-cells weui-cells_form">
<div class="weui-cell">
<div class="weui-cell__hd"><label class="weui-label">表单项</label></div>
<div class="weui-cell__bd">
<input class="weui-input" placeholder="请输入内容"/>
</div>
</div>
</form>
4. 弹出层（Popup）：
<view>
<button class="weui-btn" bindtap="showPopup">显示弹窗</button>
<popup hidden="{{!popupHidden}}" bindclose="closePopup">
<!-- 弹窗内容 -->
</popup>
</view>
在相应的 JS 文件中需要定义 showPopup 和 closePopup 函数。
5. 加载中（Loading）：
<view>
<button class="weui-btn" bindtap="showLoading">显示加载中</button>
<loading hidden="{{!loadingHidden}}">加载中...</loading>
</view>
在相应的 JS 文件中需要定义 showLoading 函数。
6. 消息提示（Toast）：
<view>
<button class="weui-btn" bindtap="showToast">显示消息</button>
<toast hidden="{{!toastHidden}}">提示消息</toast>
</view>
在相应的 JS 文件中需要定义 showToast 函数。
这些是 WeUI 的一些基础组件的简单用法。使用这些组件可以让开发者更方便地构建符合微信设计风格的小程序界面。在实际开发中，你可以根据项目需求组合使用这些组件，或者根据 WeUI 文档查阅更多组件的用法和样式定制方式。
转载请注明出处：http://www.zyzy.cn/article/detail/1324/微信小程序