zhuoxin-leader-uniapp/components/fxyk-button/fxyk-button.vue

<template>
	<u-button 
		:style="buttonStyle" 
		hover-class="none" 
		:class="{'custom-style': !isLoginButton,
				 'login-style': isLoginButton}" 
		:hair-line="false">
		{{ content }}
	</u-button>
</template>

<script>
	export default {
		props: {
			// 内容
			content: {
				type: String,
				default: ''
			},
			// 宽度
			width: {
				type: String,
				default: '583'
			},
			// 高度
			height: {
				type: String,
				default: '83'
			},
			// 背景颜色
			bgColor: {
				type: String,
				default: '#42349A'
			},
			// 是否为登录按钮 登录按钮文字样式 和其他不一样
			isLoginButton: {
				type: Boolean,
				default: false
			}
		},
		computed: {
			buttonStyle() {
				return {'width': this.width + 'rpx',
				'height': this.height + 'rpx',
				'background-color': this.bgColor}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.custom-style {
		font-size: 33rpx;
		font-family: SimSun;
		font-weight: 400;
		line-height: 44rpx;
		color: #FFFFFF;
		border: none!important;
	}
	.login-style {
		font-size: 42rpx;
		font-family: Segoe UI;
		font-weight: 400;
		line-height: 56rpx;
		color: #FFFFFF;
		border: none!important;
	}
</style>