问题：
1.键盘输入框随内容自动增高
2.每次发完消息屏幕在发出消息的最底部（以及上拉在最上面）
3.键盘弹起不盖住屏幕内容
解决：
一、解决输入框内容的自动增高
如上图一样输入内容变多之后自动换行，而且限制高度（高度我们用max-height限制就好了）
那么我们来看看我们怎么让内容自动换行吧。
input我们都知道输入内容会一直往后走，并不会自动换行（h5中可以给div加上contenteditable操作等等，pc中可以操作dom判断换行操作等等）。
所以小程序我选择的是textarea标签，它有一个属性自动增高
写几行不想自动增高了可以给它一个max-height限制超出隐藏，这样就解决了问题。
二、解决一进入到页面就是在最底下以及发完送消息也在最下面和下拉也在最上面页面显示问题
我们都习惯知道，一进入页面就是在消息列表的最下面，以及我们下拉刷新，刷新成功我们在刷新消息的最上面一些操作习惯
之前有人用wx.pageScrollTo下面这种方式去实现（个人感觉一进入页面就会有闪烁、页面大小算不准一些问题所以另外想了种办法）
//获取容器高度，使页面滚动到容器底部pageScrollToBottom:function(){wx.createSelectorQuery().select('#j_page').boundingClientRect(function(rect){//使页面滚动到底部wx.pageScrollTo({scrollTop:rect.bottom})}).exec()},j_page为页面容器的id使用rect.bottomrect.height均能达到滚动到底部的效果在数据更新后（setData回调函数）使用我最后使用的方法使用scroll-view利用scroll-view中的
属性html:
scroll-viewscroll-ystyle="height:100vh"bindscrolltoupper="pullDownRefresh"scroll-into-view='{{toView}}'//你的聊天内容/scroll-view
我们在渲染消息列表的时候绑定一个id，比如id="msg-{{index}}"然后我们获取消息列表，toView绑定的数就是'msg-'+(this.data.content.length-1)this.data.content就是你的消息列表的list的长度
这样我们一进入到页面就是在最下面一条消息的位置。
上拉刷新代码如下（因为用的scroll-view我们需要手动开启上拉刷新，利用bindscrolltoupper事件执行）
/下拉刷新/pullDownRefresh(){varthat=this;wx.startPullDownRefresh({success:res={if(that.data.currentPagethat.data.pageSizethat.data.total){//wx.showToast({//title:'暂无更多聊天记录',//icon:'none'//})wx.stopPullDownRefresh();return;};that.getChatDetail('pull');that.setData({toView:"msg-0"})wx.stopPullDownRefresh();}})},
三、解决键盘弹起不遮盖屏幕内容
本以为设置
可以解决这个问题，可是并不太友好。那就看下面这种方式：
利用文本框的bindfocus可以获取键盘的高度，以及wx.getSystemInfoSync()获取页面的高度（点击查看详情）
代码如下
//获取焦点bindInpFocus(e){varwindowHeight=wx.getSystemInfoSync().windowHeight;log('聚焦',windowHeight-e.detail.height)this.setData({scrollHeight:windowHeight-e.detail.height+"px",//绑定scroll-view的高度变化初始值：100vhtoView:'msg-'+(this.data.messageContent.length-1),fixBottom:e.detail.height+"px"//键盘离底部的距离=键盘的高度的位置})log(this.data.scrollHeight)},//失去焦点bindInpBurl(){log('失焦')this.setData({scrollHeight:'100vh',fixBottom:'0px',toView:'msg-'+(this.data.messageContent.length-1)})},
以上就解决了三个细节问题。
聊天中的日期显示，请看这篇过滤器的使用（）
有问题请留言，看到评论及时回复（欢迎个人有更多好的方法，留言讨论）
