关于微信小程序警告“Do not have handler in component: pages/xxx/xxx. “的解决方法

📚文章目录

📌关于警告

📄简单翻译一下

🎯出现原因

📝解决方法

💻测试代码

---

📌关于警告

Do not have  handler in component: pages/register/register. 

Please make sure that  handler has been defined in pages/register/register.

📄简单翻译一下

🎯出现原因

使用model:value="{{xxx}}"，对表单进行数据的双向绑定，绑定后，在表单输入信息是弹出警告。虽然这些警告，问题不大，但是在表单数据中，每输入一个字符都会弹出一次，我这里的应用场景是手机号码，那怎么说我每输入一个数字就弹出一个警告，这样有可能会覆盖到其他的警告或者报错，影响调试和操作。

❗说到双向数据绑定，我们在定义这个变量的时候要注意，要定义在data根目录下，不能定义在data的其他对象里面。因为这样在调用的时候获取不到这个数据。

📝解决方法

通过资料查询和微信开发者社区询问，原因是没有绑定bindinput方法，因此我们可以为表单绑定一个空的方法，来解决这个警告。

// wxml页面
bindinput="xxx"绑定在标签中

// js页面
xxx: function () {},

然后在表单中输入数据，Console控制台就不会一直弹出这个警告了

💻测试代码

wxml代码

<!--pages/register/register.wxml-->
<view style="text-align: center;font-family: 'kaiti';font-size: 20px;">注册账号，参加活动</view>

<view class="page_section">
  <view class="weui-cells__title">姓名</view>
  <view class="weui-cells weui-cells__after-title">
    <view class="weui-cell weui-cell_input">
      <input type="text" placeholder="请输入姓名" class="weui-input" bindchange="inputName" />
    </view>
  </view>
</view>

<view class="page_section">
  <view class="weui-cells__title">手机号码</view>
  <view class="weui-cells weui-cells__after-title">
    <view class="weui-cell weui-cell_input">
      <input type="number" placeholder="请输入手机号码" class="weui-input" model:value="{{mobile}}" bindinput="textCallback"/>
    </view>
  </view>
</view>

<view class="page_section">
  <view class="weui-cells__title">性别</view>
  <view class="weui-cells weui-cells__after-title">
    <radio-group bindchange="radioChange">
      <label for="" class="weui-cell weui-check__label">
        <view>
          <radio value="1" checked="true"></radio>
        </view>
        <view>男</view>
      </label>
      <label for="" class="weui-cell weui-check__label">
        <view>
          <radio value="2"></radio>
        </view>
        <view>女</view>
      </label>
    </radio-group>
  </view>
</view>

<view class="page_section">
  <view class="weui-cells__title">班级</view>
  <view class="weui-cells weui-cells__after-title">
    <picker range="{{className}}" vlaue="{{person.classIndex}}" bindchange="pickChange">
      <view class="weui-cell weui-cell_input">
        <view>{{className[person.classIndex]}}</view>
      </view>
    </picker>
  </view>
</view>
<button type="primary" bindtap="register">注册</button>
<view style="text-align: center;font-family: 'kaiti';">积极参与，智慧人生</view>

js代码

// pages/register/register.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    className: ['软件1班', '软件2班', '软件3班', '软件4班', '软件5班', '软件6班'],
    person: {
      name: "",
      classIndex: 0,
      gender: 1,
    },
    mobile: ''
  },
  radioChange: function (e) {
    // console.log(e.detail.value);
  },
  pickChange: function (e) {
    // console.log(e.detail.value);
    this.setData({
      ["person.classIndex"]: e.detail.value
    })
  },
  inputName: function (e) {
    // console.log(e.detail.value);
    this.data.person.name = e.detail.value
  },
  register: function (e) {
    let name = this.data.person.name;
    // console.log(name);
    let mobile = this.data.mobile;
    // console.log(this.data.mobile);
    let gender = this.data.person.gender;
    // console.log(this.data.person.gender==1?'男':'女');
    let className = this.data.className[this.data.person.classIndex];
    // console.log(this.data.className[this.data.person.classIndex]);
    var registerInfo = [name, mobile, gender, className];
    // let registerInfo2=e.currentTarget.dataset.registerInfo;
    // console.log(registerInfo);
    if (name == '' || mobile == '' || gender == '' || className == '') {
      wx.showToast({
        title: '请输入完整信息',
        icon: 'error',
        duration: 2000
      })
    } else {
      wx.showToast({
          title: '注册成功',
          icon: 'success',
          duration: 2000
        }),
        wx.setStorage({
          key: "registerInfo",
          data: registerInfo
        }),
        wx.navigateTo({
          url: "../registerInfo/registerInfo",

        })
      // console.log(registerInfo);
    }
  },
  textCallback: function () {}

---

🎯点赞收藏，防止迷路🔥 

---