在线生成二维码，适用于多有平台端，在线api接口形式

只需要传入生成二维码的内容即可，请求成功会返回二维码的base64字符串，还可定制二维码中间的logo图标，十分方便，废话不多说上代码

<template>
	<view>
		<image v-if="qrcode && status==='no'" :src="'data:image/png;base64,' + qrcode" style="width: 300rpx;height: 300rpx;" />
		<view v-else-if="status==='loading'" style="margin-top: 50rpx;">
			<image src="/static/icon_spinner.png" style="width: 68rpx;height: 68rpx;" class="rotating-element"></image>
		</view>
		
		<input v-model="text" placeholder="请输入二维码内容" class="input_style" />
		
		<view @click="createQrcode" class="btn">一键生成二维码</view>
		
		<view class="tip" @click="copy">查看更多API和功能请移驾 https://5555api.com，轻语api (点击复制链接)</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 二维码内容
				text: 'https://5555api.com',
				qrcode: '',
				status: 'none'
			}
		},
		onLoad() {

		},
		methods: {
			copy(){
				uni.setClipboardData({
					data:'https://5555api.com',
					success() {
						uni.showToast({
							title:'已复制链接',
							icon:'none'
						})
					}
				})
			},
			createQrcode(){
				if(!this.text || this.text.length < 1){
					uni.showToast({
						title:'请输入二维码内容，可网址',
						icon:'none'
					})
					return;
				}
				
				let that = this;
				that.status = 'loading';
				
				uni.request({
					method:'POST',
					url:'https://5555api.com/data/api',
					data:{
						apikey: 'test_app_key_5555api.com',
						action:'createQrCode',
						text: that.text,
					},
					success(res) {
						that.status = 'no';
						console.error('请求成功：', res);
						that.qrcode = res.data.data.qrcode;
					},
					fail() {
						that.status = 'no';
					}
				});
			}
		}
	}
</script>

<style>
	@keyframes rotateAnimation {
	  from {
		transform: rotate(0deg);
	  }
	  to {
		transform: rotate(360deg);
	  }
	}

	.rotating-element {
	  animation: rotateAnimation 2s linear infinite;
	}
	
	.input_style{
		width: 600rpx;
		margin-left: 74rpx;
		margin-right: 75rpx;
		border: 2rpx solid #12c212;
		padding: 10rpx 20rpx;
		border-radius: 10rpx;
		font-size: 28rpx;
	}
	
	.btn{
		background-color: #12c212;
		color: #ffffff;
		display: flex;
		width: 450rpx;
		margin-left: 150rpx;
		margin-right: 149rpx;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: 30rpx;
		padding: 20rpx 0rpx;
		margin-top: 50rpx;
	}
	
	.tip{
		margin-top: 30rpx;font-size: 26rpx;margin-left: 20rpx;margin-right: 20rpx;
	}
</style>