Files
ClassContent/历届学生/17届课程/团队练手私活项目/h5share_code/src/components/OpenComments.vue
2024-09-27 02:06:13 +08:00

66 lines
1.2 KiB
Vue

<template>
<div class="comments" v-show="switchs" :style="comments">
<h2 @click="openComments">打开APP查看全部评论</h2>
</div>
</template>
<script>
export default {
name: "Comments",
data() {
return {
switchs: true, // 控制 显示与否
comments: {
position: '' // 控制 定位 与否
}
}
},
props: {
switch:String, // 是否显示
position:String // 接受 css
},
methods: {
/**
* openComments
* 用于打开app 查看评论
*/
openComments() {
console.log("打开按钮");
// this.switchs = false
}
},
created () {
// 接受值
this.switchs = this.switch
// 接受值 判断
this.comments.position = this.position == "block" ? this. position : 'fixed'
// console.log(this.comments.position);
}
};
</script>
<style scoped lang="stylus">
.comments
width 10rem
height 1.693rem
display flex
justify-content center
bottom 0
left 0
h2
width: 9.36rem
height: 1.173rem
border-radius: 0.107rem
border: solid 0.027rem #d0302c
font-size: 0.373rem
display flex
justify-content center
align-items center
color: #d0302c
letter-spacing: 0rem
font-weight: normal
font-stretch: normal
font-family: PingFangSC-Medium
font-size: 0.373rem
</style>