var content;
Page({
/**
* 页面的初始数据
*/
data: {
list:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18],
itemID:"",
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
// this.scrollBottom();
},
onbtn(){
var newList = [];
for(var i=0;i<this.data.list.length;i++){
newList.push(this.data.list[i])
}
newList[newList.length] = content;
this.setData({
list: newList
})
this.scrollBottom();
},
oninput(e){
console.log(e);
content = e.detail.value;
},
onfocus(){
this.scrollBottom();
},
//滚动到底
scrollBottom(){
var itemID = this.data.list.length;
itemID = itemID-1;
console.log(itemID);
this.setData({
itemID: "item"+itemID
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
<view class="pagebody">
<scroll-view class="showContent" scroll-y="true" scroll-into-view="{{itemID}}">
<view class="list" wx:for="{{list}}" wx:key="{{index}}" id="item{{index}}">
{{item}}
</view>
</scroll-view>
<view class="bottom">
<input placeholder="输入内容" bindfocus="onfocus" bindinput="oninput"></input>
<button class="" type="warn" bindtap="onbtn">发送
</button>
</view>
</view>
.pagebody{
display: flex;
flex-direction: column;
width: 100vw;
height: 100vh;
}
.showContent{
flex: 1;
overflow: hidden;
}
.bottom{
height: 100rpx;
background: greenyellow;
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0 40rpx;
}
.bottom input{
height: 100rpx;
}
.list{
height: 80rpx;
text-align: center;
line-height: 80rpx;
}
button{
margin: 0;
}