微信小程序表单验证错误提示。

  在之前，在做填写表单之类的东西时候，凡是需要判断是否合格的， 我都会给他 

wx.showToast({

        title: '手机号有误！',
        icon: 'loading',
        duration: 2000

      })  

之类的等等。 

因为这个弹框确实是有点影响用户的操作流畅性。于是，我就四处浏览各种form表单的醋无提示方法。

最后脚本之家有人发的提示帖子中看到。

弹出在顶部的错误提示。具体的代码如下：

在WXML里面创建view：

<view class="ad_popError" wx:if="{{popErrorMsg}}">{{popErrorMsg}}</view>

WXSS具体的样式也粘出来：

 .ad_popError{ background: #de352d; color: #fff; height: 70rpx; line-height: 58rpx; font-size: 30rpx; text-align: center; position: absolute; left: 0; top: 0; width: 100%; z-index:3;}

在JS中 data中定义popErrorMsg：‘’

下面就是需要给用户错误提示的时候，给popErrorMsg 赋值即可！

 this.setData(
           { popErrorMsg: "错误提示" }
        );
        this.ohShitfadeOut(); 

  ohShitfadeOut() {
    var fadeOutTimeout = setTimeout(() => {
      this.setData({ popErrorMsg: '' });
      clearTimeout(fadeOutTimeout);
    }, 3000);
  }, 

以上文章内容只是以一个微信小程序初学者慢慢了解到的一些自己觉得比较使用的方法。

学如逆水行舟，不进则退！