微信小程序の自定义顶部错误提示动画

关于微信小程序的错误提示，官方只提供了弹窗模式的一些，且提示的文字长度有限制，有时候需要采用在顶部显示错误提示，那么就需要自定义样式。首先显示下效果图如下

如何实现这样的效果呢？ 接下来直接上小程序代码。

首先在 wxml 文件中加入显示view，只是简单的一行代码哈哈哈哈

<view class="err-show" wx:if="{
  {errorMessage}}">{
  {errorMessage}}</view>

解释一下，errorMessage 是在 js 的data中定义的，用于错误提示的内容，初始化时为空。wx:if 的作用是当错误提示内容不为空时，就渲染显示这个view，以达到有错误的自动渲染，没有错误时就不会渲染也就不会显示了。

看下 err-show 的样式，在 wxss 中加入如下样式即可。可以根据自己的需求，修改相应的属性值。

.err-show {
  background: #f36127;
  color: #fff;
  height: 58rpx;
  line-height: 58rpx;
  font-size: 24rpx;
  text-align: center;
  position: absolute;
  left: