当前位置:   article > 正文

解决input组件变量undefined问题_input的value是undefined

input的value是undefined

        在搭建微信小程序时候使用input和bindinput获取实时输入数据会有bug,会使微信开发工具console端输出警告⚠,打印input的value说是未定义。例如:Setting data field "addRess" to undefined is invalid.

 wxml代码段:

  1. <view class="input2">
  2. <input type="text" placeholder="输入详细位置" bindinput="addRess" value="{{addRess}}"/>
  3. </view>

js代码段:

  1. addRess(e){
  2. this.setData({
  3. addRess:e.detail.value
  4. })
  5. },

        其中一种可能使版本库的问题,切记不要把bindinput写成bindtap 。

        上述方法不能实时监听input输入,因此我们需要使用data- 传递参数到逻辑层,然后再使用中括号的方式 setData,只更新当前编辑的数据,解决问题且性能更好。如下:

wxml

  1. <view class="input2">
  2. <input type="text" data-params="addRess" placeholder="输入详细位置" bindinput="addRess" value="{{addRess}}"/>
  3. </view>

js

  1. addRess(e){
  2. let {param}=e.currentTarget.dataset
  3. const dataPath=`formData.${param}`
  4. this.setData({
  5. addRess:e.detail.value
  6. })
  7. },

 

问题解决

 

声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号