<view>
<button class="weui-btn" bindtap="showError">显示错误提示</button>
<toptips wx:if="{{showErrorTip}}" type="error" bind:animationend="hideError">错误提示信息</toptips>
</view>
在相应的 JS 文件中,需要定义 showError 函数来显示错误提示,并定义 hideError 函数来隐藏错误提示:
Page({
data: {
showErrorTip: false,
},
showError: function () {
this.setData({
showErrorTip: true,
});
},
hideError: function () {
this.setData({
showErrorTip: false,
});
},
});
在上述示例中,当用户点击按钮时,调用 showError 函数显示错误提示。toptips 组件的 wx:if 属性用于控制是否显示错误提示,bind:animationend 事件用于监听动画结束事件,当动画结束时调用 hideError 函数隐藏错误提示。
你可以根据实际需求定制错误提示的内容、样式和显示时间等。这是一个简单的 WeUI 顶部错误提示组件的使用示例,你可以根据项目需求进行更进一步的定制。
转载请注明出处:http://www.zyzy.cn/article/detail/1336/微信小程序