zhuchunyun/flinfo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

解决进入页面无法到底部问题

Browse Source
This commit is contained in:
许允枞 2025-03-14 09:51:29 +08:00
parent 463f26d465
commit b977324bb7
2 changed files with 54 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
dc-App/pages/Chat/newChat.vue
View File

@ -28,7 +28,8 @@
<view class="right_top"></view>
</view>
<!-- 聊天内容 -->
<scroll-view class="chat" id="scrollview" scroll-y="true" scroll-with-animation="true" :scroll-into-view="scrollToView">
<scroll-view class="chat" id="scrollview" scroll-y="true" scroll-with-animation="true"
:scroll-into-view="scrollToView">
<view class="chat-main" :style="{paddingBottom:inputh+'px'}" id="msglistview">
<view class="chat-ls" v-for="(item,index) in messagesList" :key="index" :id="'msg'+ index">
<view class="msg-m msg-right" v-if="item.isTrans">
@ -494,7 +495,11 @@ export default {
} else {
this.messagesList = tempList
}
this.goBottom()
//延时五秒
setTimeout(() => {
this.goBottom()
}, 500);
// this.goBottom()
},
// 获取历史消息
getMessage() {
@ -528,7 +533,9 @@ export default {
that.$set(that.messagesList, that.messagesList.length - 1, that.messagesList[that.messagesList
.length - 1])
// 数据挂载后执行，不懂的请自行阅读 Vue.js 文档对 Vue.nextTick 函数说明。
that.goBottom()
setTimeout(() => {
that.goBottom()
}, 500);
}
get();
@ -698,7 +705,6 @@ export default {
},
// 滚动到底部
goBottom() {
this.$nextTick(() => {
this.scrollToView = this.scrollId;
this.$nextTick(() => {
@ -709,22 +715,22 @@ export default {
})
},
// 滚动至聊天底部
scrollToBottom(e){
setTimeout(()=>{
scrollToBottom(e) {
setTimeout(() => {
let query = uni.createSelectorQuery().in(this);
query.select('#scrollview').boundingClientRect();
query.select('#msglistview').boundingClientRect();
query.exec((res) =>{
if(res[1].height > res[0].height){
query.exec((res) => {
if (res[1].height > res[0].height) {
this.scrollTop = this.rpxTopx(res[1].height - res[0].height)
}
})
},15)
}, 15)
},
// px转换成rpx
rpxTopx(px){
rpxTopx(px) {
let deviceWidth = uni.getSystemInfoSync().windowWidth
let rpx = ( 750 / deviceWidth ) * Number(px)
let rpx = (750 / deviceWidth) * Number(px)
return Math.floor(rpx)
},
}

59
dc-App/pages/my/Contact.vue
View File

@ -2,28 +2,28 @@
<view class="contact-container">
<u-card title="Contact Us" class="card">
<view class="info">
<u-icon name="map" size="28" color="#2E7D32" />
<u-icon name="map" size="28" color="#2E7D32"/>
<text class="info-text">123 Main Street, New York, NY 10001</text>
</view>
<view class="info">
<u-icon name="phone" size="28" color="#2E7D32" />
<u-icon name="phone" size="28" color="#2E7D32"/>
<text class="info-text">+1 (123) 456-7890</text>
</view>
<view class="info">
<u-icon name="email" size="28" color="#2E7D32" />
<u-icon name="email" size="28" color="#2E7D32"/>
<text class="info-text">contact@company.com</text>
</view>
</u-card>
<u-form labelPosition="top" :model="form" ref="formRef" class="">
<u-form-item label="Name" prop="name" borderBottom>
<u-input v-model="form.name" placeholder="Enter your name" font-size="18" />
<u-form labelPosition="top" :rules="rules" :model="form" ref="formRef">
<u-form-item label="Name" prop="name" borderBottom>
<u-input v-model="form.name" placeholder="Enter your name" font-size="18"/>
</u-form-item>
<u-form-item label="Email" prop="email" borderBottom>
<u-input v-model="form.email" placeholder="Enter your email" font-size="18" />
<u-input v-model="form.email" placeholder="Enter your email" font-size="18"/>
</u-form-item>
<u-form-item label="Message" prop="message" borderBottom>
<u-textarea v-model="form.message" font-size="18" placeholder="Enter your message" ></u-textarea>
<u-textarea v-model="form.message" font-size="18" placeholder="Enter your message"></u-textarea>
</u-form-item>
<view class="button-container">
<u-button @click="submitForm" class="submit-button" text="Submit"></u-button>
@ -45,7 +45,26 @@ export default {
name: [
{
required: true,
message: '请输入姓名',
message: 'Please enter your name',
trigger: ['blur', 'change']
}
],
email: [
{
required: true,
message: 'Please enter your email address',
trigger: ['blur', 'change']
},
{
pattern: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
message: 'Please enter a valid email address',
trigger: ['blur', 'change']
}
],
message: [
{
required: true,
message: 'Please enter your feedback',
trigger: ['blur', 'change']
}
]
@ -55,21 +74,11 @@ export default {
methods: {
submitForm() {
this.$refs.formRef.validate().then(res => {
uni.$u.toast('校验通过')
uni.showToast({title: 'Successfully', icon: 'success'});
this.form = {name: '', email: '', message: ''};
}).catch(errors => {
uni.$u.toast('校验失败')
uni.$u.toast('Validation failed')
})
if (!this.form.name || !this.form.email || !this.form.message) {
uni.showToast({ title: 'Please fill in all fields', icon: 'none' });
return;
}
//验证邮箱
if (!this.form.email.match(/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/)) {
uni.showToast({ title: 'Invalid email address', icon: 'none' });
return;
}
uni.showToast({ title: 'Successfully', icon: 'success' });
this.form = { name: '', email: '', message: '' };
}
}
};
@ -86,6 +95,7 @@ export default {
font-size: 20rpx;
background-color: #FFFFFF;
}
.card {
width: 90%;
padding: 30rpx;
@ -94,6 +104,7 @@ export default {
color: #FFFFFF;
border-radius: 20rpx;
}
.info {
display: flex;
align-items: center;
@ -101,11 +112,13 @@ export default {
margin-bottom: 20rpx;
color: #FFFFFF;
}
.info-text {
margin-left: 15rpx;
font-size: 22rpx;
color: #FFFFFF;
}
.form-container {
width: 90%;
//display: flex;
@ -113,12 +126,14 @@ export default {
align-items: center;
font-size: 22rpx;
}
.button-container {
display: flex;
justify-content: center;
width: 100%;
margin-top: 20rpx;
}
.submit-button {
font-size: 22rpx;
padding: 15rpx 30rpx;