收藏
回答

请问前端大牛,微博小程序的评论框是怎样做到和手机键盘紧挨的?

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 需求 input或者textarea 客户端 最新版 最新版

- 需求的场景描述(希望解决的问题)

和微博小程序一样,在评论微博文章时,手机键盘弹起,评论框会和手机键盘完美挨着

如图:

*******************************************图片分割线


- 希望提供的能力


回答关注问题邀请回答
收藏

5 个回答

  • C
    C
    2018-11-06

    input框 固定定位在页面底部(注意是用固定定位fixed而不是用绝对定位position),然后使用input组件的cursorspacing属性控制input框与键盘之间的距离,adjust-position属性不要更改,默认开启,支持键盘弹起时,页面自动上推,就能实现你想要的效果了。

    还要注意的是,目前这种方案在安卓端没问题,在ios端,系统12以下也没问题,如果已经更新到了ios12版本,使用默认输入法也没问题,但如果使用了第三方输入法(比如搜狗),会出现input框回弹的bug,不过这点微信官方已经表明会在下个版本修复

    2018-11-06
    有用 4
    回复 1
    • Scott Wei
      Scott Wei
      2018-11-06

      谢谢,明白了

      2018-11-06
      回复
  • 半寸灰
    半寸灰
    2018-11-02

    https://developers.weixin.qq.com/s/AbQqPCmy7x3F

    代码片段

    2018-11-02
    有用 4
    回复 2
    • Scott Wei
      Scott Wei
      2018-11-02

      牛批!

      2018-11-02
      回复
    • Scott Wei
      Scott Wei
      2018-11-02

      其实就是

      cursorSpacing=20,发生的效果?


      2018-11-02
      回复
  • 移动-振杰
    移动-振杰
    2018-11-05

    先隐藏一个公共input,触发评论时用固定布局,固定到底部就可以了


    2018-11-05
    有用 1
    回复 1
    • Scott Wei
      Scott Wei
      2018-11-06

      恩恩,谢谢

      2018-11-06
      回复
  • LEI
    LEI
    2018-11-02

    input控件可以规定距离键盘的距离,官方文档是有的。

    2018-11-02
    有用 1
    回复 1
    • Scott Wei
      Scott Wei
      2018-11-02

      原来

      cursorSpacing

      这个属性,是可以做这个的?

      2018-11-02
      回复
  • Scott Wei
    Scott Wei
    2018-11-02

    期待有大牛可以教一教,谢谢!

    2018-11-02
    有用
    回复 1
    • 花儿黑马
      花儿黑马
      2019-06-21

      cursorspacing 在小米6 上测试时有问题的,其他手机没试过。在textarea中字的行数变化时,textarea 到键盘的距离是变化的

      2019-06-21
      回复
登录 后发表内容