小程序中表单和vue的表单提交的方式比较相似。但是我在设置参数值的时候,个人感觉非常麻烦.
比如,在vue中,我们申请参数postitem
postitem: {
game_id: '', //游戏ID
ltv: '', //ltv范围
}
赋值的时候,仅仅普通赋值就可以了
this.postitem.game_id=‘5’
但是在小程序中,想要设置game_id的值,就比较麻烦了。因为postitem是一个json对象,如果要设置json对象属性的值,就必须提前申明,把属性作为一个变量, 如
let test = 'postitem.game_id';
this.setData({
[test]: '5'
})
如果需要设置多个属性的值,就感觉有点坑爹了,每一个属性都需要提前定义变量,确实很累赘、 你或许认为 this.data.postitem.game_id=‘5’是可以赋值的, 但是这样赋值后,data中的值并未发生改变,在wxml中看到的值是未被赋值的值。这结果后续可能引发意想不到的问题。
其次就是input提交值的问题。 在api上我们看到form用法: 当点击 表单中 formType 为 submit 的 组件时,会将表单组件中的 value 值进行提交,需要在表单组件中加上 name 来作为 key。 所以需要在input上写name, name为我们提交的参数
<form bindsubmit="changePwd">
<input class="text-input" password value="{{passcode1}}" name="passcode1" bindinput="samepwd" minlength="6" maxlength="18" adjust-position="{{false}}" placeholder="输入新密码" />
<button formType="submit" class="sure-btn {{ subable? 'disable': '' }}" disabled="{{subable}}">确认</button>
</form>
微信扫码体验