评论

cover-view实现input标签功能

在小程序中,cover-view嵌套input标签,在真机中会被忽略。可以通过使用cover-view和input标签来模拟input标签的功能

html代码:

<cover-view class='items'>
	<cover-view class='name'>设备名</cover-view>
	<cover-view class='display' bindtap='inputNameState'>
	{{nameInfo}}
	</cover-view>
        <cover-view class='border'></cover-view>
	<input type="text" focus="{{nameTrue}}" bindinput="inputName"></input>
</cover-view>

js代码:

inputNameState(){
  this.setData({
     nameTrue: true
  })
},

inputName(e){
  this.setData({
    nameInfo: e.detail.value
  })
}

实际效果

最后一次编辑于  2019-05-13  
点赞 3
收藏
评论

3 个评论

  • 乔榛
    乔榛
    2019-11-09


    可以实现这样的标签吗?

    2019-11-09
    赞同
    回复
  • Simple
    Simple
    2019-05-14

    好是好 就怕cover-view以后改了

    2019-05-14
    赞同
    回复
  • 拾迹
    拾迹
    2019-05-13

    光标如何模拟?

    2019-05-13
    赞同
    回复 1
    • TNT
      TNT
      2019-05-13

      里面包裹的 input标签

      2019-05-13
      回复
登录 后发表内容