本文介绍了在制作小程序聊天功能时遇到的三个关键问题：输入框自动增高、页面滚动定位以及键盘弹起时不遮挡内容的解决方案。通过使用textarea、scroll-view组件和bindfocus事件，实现了符合用户习惯的聊天界面效果。
记录做的一次仿聊天的小程序碰到的一些细节
问题：
1.键盘输入框随内容自动增高
2.每次发完消息屏幕在发出消息的最底部（以及上拉在最上面）
3.键盘弹起不盖住屏幕内容
解决：
一、解决输入框内容的自动增高
如上图一样输入内容变多之后自动换行，而且限制高度（高度我们用max-height限制就好了）
那么我们来看看我们怎么让内容自动换行吧。
input 我们都知道输入内容会一直往后走，并不会自动换行（h5中可以给div加上contenteditable 操作等等，pc中可以操作dom判断换行操作等等）。
所以小程序我选择的是 textarea 标签，它有一个属性自动增高
最低0.47元/天 解锁文章
扫一扫
3848
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
