微信小程序> 微信小程序在form组件提交时拿自定义input组件的值-微信小程序input组件-微信小程序button跳转

微信小程序在form组件提交时拿自定义input组件的值-微信小程序input组件-微信小程序button跳转

浏览量:1655 时间: 来源:你是谁-

1.form表单:

formbindsubmit="formSubmit"表单!--自定义的input组件只需要在这个自定义的组件中加上name属性即可,不需要在组件中的input上加name属性--my-inputname="test"/my-inputbuttonform-type="submit"提交/button/form

2.自定义input组件:

!--自定义input组件--view!--这里不需要设置name属性,而是在调用组件时,添加name属性。如my-inputname="test"/my-input--inputbindinput="getInputValue"/input/view

3.自定义input组件js文件:

4.提示:behaviors的功能相当于组件之间公用代码,里面有公用的属性、方法。可以把behavior当做构造函数,别的组件能使用这个behavior的方法和数据。

Component({behaviors:['wx://form-field'],//wx://form-field代表一个内置behavior,它使得这个自定义组件有类似于表单控件的行为。properties:{//value:{//其实要在自定义input组件中设置固定(默认)值,可以直接在properties中设置,不用在attached中调用setData设置//type:String,//value:'1'//默认值为1//}},attached(){//this.setData({//value:'官网给出的例子:在attached生命周期设置的value值是固定的,所以我在input失去焦点时,设置value值'//})},methods:{getInputValue(e){this.setData({value:e.detail.value//behaviors:['wx://form-field']里面就有设置value属性,所以我们可以直接拿来设置value})}}})

5.效果:

6.代码:

7.https://pan.baidu.com/s/1zOevIeELEb1hxSpULnIgqw(这个例子中之前使用了input的bindblur失去焦点事件,需要改成bindinput事件)提取码:e31z

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎