newmyj/pages/public/agreement.vue

<template>
	<view class="buttomText flex" @click="checkedChange">
		<image v-if='checked' class="buttomIcon" src="../../static/icon/addressIconXz.png" mode="scaleToFill">
		</image>
		<view class="buttomNo" v-else>

		</view>
		<text class="margin-l-10">勾选代表同意</text>
		<navigator url="./userAgreement">
			<text class="next-text">母婴界严选服务</text>
		</navigator>
		<text>与</text>
		<navigator url="./privacyAgreement">
			<text class="next-text">隐私条例</text>
		</navigator>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 是否选中
				checked: false,
			};
		},
		methods: {

			checkedChange() {
				this.checked = !this.checked;
				this.$emit('checkedChange', this.checked)
			}
		},
	};
</script>

<style lang="scss">
	.buttomText {
		margin-top: 30rpx;
		justify-content: center;
		font-size: 24rpx;
		color: $font-color-light;

		.buttomIcon,
		.buttomNo {
			width: 40rpx;
			height: 40rpx;
		}
		.next-text{
			color: $uni-color-primary;
		}
		.buttomNo {
			border: 1px solid $font-color-light;
			border-radius: 100rpx;
		}
	}
</style>