uni-app中textarea组件
textarea组件,官⽅给出的监听事件有以下事件:
其中⼀定要注意,当使⽤ v-model 对表单内容进⾏双向绑定的时候,@input 事件是在绑定变量变化前触发的,所以如果在input事件内打印绑定变量,会得不到值,因为input执⾏的时候,v-model绑定的变量还没变化,如下所⽰:
可以看到,第⼀次打印的v-model绑定的变量是空的,⽽第⼆次打印出来的值却是第⼀次输⼊赋给的值,说明第⼆次输⼊还没有造成v-model绑定变量发⽣变化。
除此之外,注意看@input事件的传值:
通常情况下,@input=“input”的写法⾥,是没有传值的,这个时候,在methods⾥,input(e){}函数中打印出来的 e.detail.value 就是输⼊框中实时的内容。
但是,假如写⽅法的时候给 input ⼀个传值,例如:@input="input(index)" 此时,在methods⾥,input(index){}函数中打印出来的就是 index 的值。
综上,@input⽅法在没有传值的时候是默认可以取到输⼊框中实时的内容数据,但是如果主观的添加传值,则取到的就是所传的参数值。这样的情况可以在循环中⽤来传索引值。
tips:那如果在传值的时候⼜想要索引值⼜想要实时的输⼊框内容数据怎么办呢?
textarea中cols表示这个时候可以通过操作dom的⽅式加上去,写法如下:
@input="input($event , index)", 在methods⾥为 input($event , index){},但是需要注意的是,这样的写法,只能在进⾏输⼊操作的时候获取到输⼊框的实时数据,如果是对输⼊框内容的删减操作,取出来的数据就是null。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论