1. 苹果手机下只留input框的下划线，安卓使用border:none是可以的，苹果会出现拐角处也会有线条，这样就跟ui图不一样了，所以想办法去除掉，经过搜索发现这是 webikt 内核浏览器通过私有属性 -webkit-appearance 对控件设置了默认样式。
input{ -webkit-appearance:none } // 这样就会解决苹果手机下的问题
2. 动态获取中间的内容高度（不同手机屏幕显示的高度也是不一样，滚动只滚动中间那一部分）
我曾使用过css中的cale() 来计算出内容中间的高度，但是最后还是发现了问题，因为移动端布局是用rem来进行适配，而cale来计算是百分比，虽然rem可以转换成百分比，但是还是不是特别的妥当。
最后我使用的是动态获取中间内容的高度来进行计算，就比较好用，但是有一个问题，一开始我将计算出来的变量是存放在data里面的（vue）导致在苹果手机上动态获取到的内容并不显示，后来直接用const定义变量就没关系。
3. 评论框兼容（虚拟框弹出键盘遮挡问题）
评论框定位（position: fixed）在页面的最低端，点击评论框会弹出虚拟框并在虚拟框的上方，在苹果机上使用position:fixed是相当于absolute，所以还会在页面的最底部，最后了解到scrollByLines() scrollIntoView(true) scrollIntoViewIfNeeded()
// 解决苹果下虚拟框弹出键盘遮挡问题
releaseContent () {
let interval = null
$('#releaseContent').focus(function () {
let target = this
interval = setInterval(function () {
// target.scrollByLines()
target.scrollIntoView(true)
// target.scrollIntoViewIfNeeded()
}, 100)
}).blur(function () {
clearInterval(interval)
})
}
使用了scrollIntoView()只是解决了一半苹果的问题，在iPhone8以下是可以的，在iPhone8plus就不可以，还是会出现虚拟框遮挡的问题，这个问题我也是不知道怎么才会解决，希望大神们，多多指教一下。
关于scrollIntoView的地址查看 https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView
2018-11-22