You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
86 lines
1.8 KiB
86 lines
1.8 KiB
<template>
|
|
<!-- :style="{ bottom: bottom + 'px' }" -->
|
|
<view class="comment-container" >
|
|
<uni-easyinput
|
|
v-model="value"
|
|
type="textarea"
|
|
placeholder="HI，请留下您的留言吧!"
|
|
:inputBorder="false"
|
|
></uni-easyinput>
|
|
<button class="commit" type="primary" :disabled="!value" @click="onBtnClick">
|
|
提交
|
|
</button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { userArticleComment } from 'api/user';
|
|
|
|
export default {
|
|
name: 'article-comment-commit',
|
|
props: {
|
|
},
|
|
data() {
|
|
return {
|
|
value: '',
|
|
bottom: 0
|
|
};
|
|
},
|
|
created() {
|
|
// 检测软键盘的变化
|
|
uni.onKeyboardHeightChange(({ height }) => {
|
|
this.bottom = height;
|
|
});
|
|
},
|
|
methods: {
|
|
/**
|
|
* 发送按钮点击事件
|
|
*/
|
|
async onBtnClick() {
|
|
// 展示加载框
|
|
uni.showLoading({
|
|
title: '加载中'
|
|
});
|
|
// 异步处理即可
|
|
// const { data: res } = await userArticleComment({
|
|
// articleId: this.articleId,
|
|
// content: this.value
|
|
// });
|
|
console.log('this.value',this.value)
|
|
uni.showToast({
|
|
title: '发表成功',
|
|
icon: 'success',
|
|
mask: true
|
|
});
|
|
// 发表成功之后的回调
|
|
this.$emit('success', res);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.comment-container {
|
|
position: relative;
|
|
padding: 10px;
|
|
::v-deep .uni-easyinput{
|
|
width: calc(100% - 20px) !important;
|
|
background-color: #fff;
|
|
padding: 12px;
|
|
box-shadow: 0px 3px 60px 1px rgba(0,0,0,0.08);
|
|
border-radius: 6px;
|
|
}
|
|
::v-deep .uni-easyinput__content{
|
|
padding: 5px 10px !important;
|
|
background: #F1F1F9 !important;
|
|
}
|
|
::v-deep .uni-easyinput__content-textarea{
|
|
height: 140px !important;
|
|
}
|
|
.commit{
|
|
margin: 40px 20px 0 20px;
|
|
background-color: #01a4fe;
|
|
border-radius: 23px;
|
|
}
|
|
}
|
|
</style>
|