import CustomPage from '../CustomPage'


CustomPage({
  onShareAppMessage() {
    return {
        title: 'form',
        path: 'page/form/form'
    }
  },
  data: {
    formData: {
    },
    rules: [{
      name: 'username',
      rules: {required: true, message: '请输入用户名'},
    }, {
      name: 'password',
      rules: {required: true, message: '请输入密码'},
    }]
  },
  submitForm() {
      console.log(this)
    this.selectComponent('#form').validate((valid, errors) => {


      if (!valid) {
        const firstError = Object.keys(errors)
        if (firstError.length) {
          this.setData({
            error: errors[firstError[0]].message
          })
        }
      } else {
          
        wx.showToast({
          title: '校验通过'
        })
      }
    })
  }


})



<view class="page" data-weui-theme="{{theme}}">
    <mp-toptips msg="{{error}}" type="error" show="{{error}}"></mp-toptips>
 <mp-form-page>
    <view class="login_title">智慧社区</view>
        <mp-form id="form" rules="{{rules}}" models="{{formData}}">
            <view class="input_inline">
                <view >
                <mp-icon icon="me" color="#07c160" size="{{25}}"></mp-icon>
                </view>
                    <input model:value="{{formData.username}}" class="weui-input" placeholder="请输入用户名"/>
            </view>
            <view class="input_inline">
                <view >
                <mp-icon icon="lock" color="#07c160" size="{{25}}"></mp-icon>
                </view>
                    <input model:value="{{formData.password}}" class="weui-input" placeholder="请输入密码"/>
                </view>
        </mp-form>


        <view class="form_button">
            <button type="primary" bindtap="submitForm">登    陆</button>
        </view>
    </mp-form-page>
</view>

{
    "component": true,
    "navigationBarTitleText": "智慧社区登陆",
  
    "usingComponents": {
      "mp-form-page": "weui-miniprogram/form-page/form-page",
      "mp-toptips": "weui-miniprogram/toptips/toptips",
      "mp-form": "weui-miniprogram/form/form",
      "mp-icon": "weui-miniprogram/icon/icon"
    }
  }