uniapp copyright 组件

最新推荐文章于 2024-09-11 12:12:55 发布

码农陆逊

最新推荐文章于 2024-09-11 12:12:55 发布

阅读量194

点赞数 1

文章标签： uni-app javascript 前端

本文链接：https://blog.csdn.net/u010737799/article/details/129180392

版权

<template>
	<view class="copyright-con" :class="isFixed ? 'copyright-fixed' : ''">
		copyright © {{year}} 公司名字
	</view>
</template>

<script>
	export default {
		name: "copyright",
		data() {
			return {
				isFixed: false,
				year: ''
			};
		},
		created() {
			this.year = new Date().getFullYear();
		},
		mounted() {
			this.setPosition();
		},
		methods: {
			setPosition() {
				let that = this;
				let view = uni.createSelectorQuery().in(this);
				uni.getSystemInfo({
					success: (res) => {
						view.select(".copyright-con").boundingClientRect(data => {
							if(data.bottom < res.windowHeight) {
								that.isFixed = true;
							} else {
								that.isFixed = false;
							}
						}).exec();
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.copyright-con {
		text-align: center;
		padding: 20rpx;
		font-size: 20rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #B3B1B1;
		width: 100vw;
		box-sizing: border-box;
	}
	.copyright-fixed {
		position: fixed;
		left: 0;
		bottom: 32rpx;
	}
</style>