uniapp全栈之初探unicloud手机号一键登录

最新推荐文章于 2024-07-25 16:21:45 发布
最新推荐文章于 2024-07-25 16:21:45 发布
阅读量690 收藏 1
点赞数 2
分类专栏： uniapp unicloud 文章标签： uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liushangxiong/article/details/131473277
版权

流程列表

  1. DCloud开放平台申请ApiKey和ApiSecret
  2. 创建云对象并引用手机号一键登录扩展库
  3. 客户端一键登录逻辑
  4. 完整代码

具体流程步骤

  • 申请ApiKey和ApiSecret
    点击开发者中心登录，进入开发者后台，选择一键登录下的基础配置
    在这里插入图片描述

  • 创建云对象并引用扩展库
    创建login云对象
    在这里插入图片描述
    引用扩展库
    右键选择管理公共模块或扩展库依赖
    在这里插入图片描述
    选择对应扩展库 uni-cloud-verify
    在这里插入图片描述
    查看login云对象下的package.json会多一个uni-cloud-verify扩展
    在这里插入图片描述
    云函数逻辑

async univerifyLogin(data) {
		let res = await uniCloud.getPhoneNumber({
			appid: '__UNI__EBC5FCF', //应用标识，可以在manifest.json基础配置查看也可以在开发者中心应用管理-我的应用查看
			provider: 'univerify',
			apiKey: 'xxxxxxx', // 在开发者中心开通服务并获取apiKey
			apiSecret: 'xxxxxxx', // 在开发者中心开通服务并获取apiSecret
			access_token: data.access_token, //由客户端传入
			openid: data.openid  //由客户端传入
		})
		return {
			code: 200,
			data: res.data,
			msg: '获取手机号成功'
		}
	}
  • 客户端逻辑
    客户端逻辑除调用云对象外都是借鉴的文档
fastLoginFn() {
				var this_ = this
				// 预登陆
				uni.preLogin({
					provider: "univerify",
					success: () => {
						uni.login({
							provider: "univerify",
							univerifyStyle: {
								"fullScreen": false, // 是否全屏显示，默认值： false
								"backgroundColor": "#ffffff", // 授权页面背景颜色，默认值：#ffffff
								"backgroundImage": "", // 全屏显示的背景图片，默认值："" （仅支持本地图片，只有全屏显示时支持）  
								"icon": {
									"path": "static/xxx.png" // 自定义显示在授权框中的logo，仅支持本地图片 默认显示App logo   
								},
								"closeIcon": {
									"path": "static/xxx.png" // 自定义关闭按钮，仅支持本地图片。 HBuilderX3.3.7+版本支持
								},
								"phoneNum": {
									"color": "#202020" // 手机号文字颜色 默认值：#202020  
								},
								"slogan": {
									"color": "#BBBBBB" //  slogan 字体颜色 默认值：#BBBBBB  
								},
								"authButton": {
									"normalColor": "#3479f5", // 授权按钮正常状态背景颜色 默认值：#3479f5  
									"highlightColor": "#2861c5", // 授权按钮按下状态背景颜色 默认值：#2861c5（仅ios支持）  
									"disabledColor": "#73aaf5", // 授权按钮不可点击时背景颜色 默认值：#73aaf5（仅ios支持）  
									"textColor": "#ffffff", // 授权按钮文字颜色 默认值：#ffffff  
									"title": "本机号码一键登录", // 授权按钮文案 默认值：“本机号码一键登录”  
									"borderRadius": "24px" // 授权按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"otherLoginButton": {
									"visible": true, // 是否显示其他登录按钮，默认值：true  
									"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值：透明 
									"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值：透明 
									"textColor": "#656565", // 其他登录按钮文字颜色 默认值：#656565  
									"title": "其他登录方式", // 其他登录方式按钮文字 默认值：“其他登录方式”  
									"borderColor": "", //边框颜色 默认值：透明（仅iOS支持）  
									"borderRadius": "0px" // 其他登录按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"privacyTerms": {
									"defaultCheckBoxState": true, // 条款勾选框初始状态 默认值： true
									"isCenterHint": false, //未勾选服务条款时点击登录按钮的提示是否居中显示 默认值: false (3.7.13+ 版本支持)
									"uncheckedImage": "", // 可选 条款勾选框未选中状态图片（仅支持本地图片 建议尺寸 24x24px）(3.2.0+ 版本支持)   
									"checkedImage": "", // 可选 条款勾选框选中状态图片（仅支持本地图片 建议尺寸24x24px）(3.2.0+ 版本支持)   
									"checkBoxSize": 12, // 可选 条款勾选框大小，仅android支持
									"textColor": "#BBBBBB", // 文字颜色 默认值：#BBBBBB  
									"termsColor": "#5496E3", //  协议文字颜色 默认值： #5496E3  
									"prefix": "我已阅读并同意", // 条款前的文案 默认值：“我已阅读并同意”  
									"suffix": "并使用本机号码登录", // 条款后的文案 默认值：“并使用本机号码登录”  
									"privacyItems": [ // 自定义协议条款，最大支持2个，需要同时设置url和title. 否则不生效  
										{
											"url": "https://", // 点击跳转的协议详情页面  
											"title": "用户服务协议" // 协议名称  
										}
									]
								},
							},
							success: (res) => {
								console.log("一键登录调用返回的数据", res)
								
								uniCloud
									.callFunction({
										name: "login", // 云函数名称
										data: {
											access_token: res.authResult.access_token, // 客户端一键登录接口返回的access_token
											openid: res.authResult.openid // 客户端一键登录接口返回的openid
										}
									})
									.then((dataRes) => {
										console.log("云函数返回的参数", dataRes)
										let phone = dataRes.result.data.phoneNumber
										this.userPhone = dataRes.result.data.phoneNumber
										// 这里进行登录操作
									})
									.catch((err) => {
										console.log("云函数报错", err)
										uni.showToast({
											title: err.errMsg,
											icon: "none"
										})
										this_ = this
										setTimeout(() => {
											uni.closeAuthView() //关闭一键登录弹出窗口
										}, 500)
									})
								uni.showToast({
									title: res.authResult,
									icon: "none"
								})
								// console.log("云函数调用返回数据", dataRes)
							},
							fail(err) {
								// 登录失败或者点击其他登录方式,自定义按钮等
								console.log("一键登录uni.login失败", err)
								uni.showToast({
									title: res.errMsg || err.metadata?.resultDesc,
									icon: "none"
								})

								setTimeout(() => {
									uni.closeAuthView() //关闭一键登录弹出窗口

								}, 500)
							}
						})
					},
					fail(res) {
						console.log("一键登录uni.preLogin失败", res)
						if (res.errMsg != "login:ok") {
							// 这里注意有个小坑: 不同运营商,返回的报错字段不同, 经过测试, 以下几乎包含了三大运营商报错字段
							uni.showToast({
								title: res.errMsg || res.metadata.resultMsg || res.metadata.error_data ||
									res.metadata.resultDesc || "请检查是否插入有效sim卡及开启蜂窝数据网络",
								icon: "none"
							})
						}
						//如果手机没有插入有效的sim卡，或者手机蜂窝数据网络关闭，
						//都有可能造成预登录校验失败。
					}
				})
			}

这里需要注意的是 success成功函数之后调用云对象的方式，刚开始借鉴的网友的一种方式，最后运行到真机上会提示 云函数报错, Error: Method name required

改进如下

            fastLoginFn() {
				console.log("手机号一键登录")
				var this_ = this
				// 预登陆
				uni.preLogin({
					provider: "univerify",
					success: () => {
						uni.login({
							provider: "univerify",
							univerifyStyle: {
								"fullScreen": false, // 是否全屏显示，默认值： false
								"backgroundColor": "#ffffff", // 授权页面背景颜色，默认值：#ffffff
								"backgroundImage": "", // 全屏显示的背景图片，默认值："" （仅支持本地图片，只有全屏显示时支持）  
								"icon": {
									"path": "static/xxx.png" // 自定义显示在授权框中的logo，仅支持本地图片 默认显示App logo   
								},
								"closeIcon": {
									"path": "static/xxx.png" // 自定义关闭按钮，仅支持本地图片。 HBuilderX3.3.7+版本支持
								},
								"phoneNum": {
									"color": "#202020" // 手机号文字颜色 默认值：#202020  
								},
								"slogan": {
									"color": "#BBBBBB" //  slogan 字体颜色 默认值：#BBBBBB  
								},
								"authButton": {
									"normalColor": "#3479f5", // 授权按钮正常状态背景颜色 默认值：#3479f5  
									"highlightColor": "#2861c5", // 授权按钮按下状态背景颜色 默认值：#2861c5（仅ios支持）  
									"disabledColor": "#73aaf5", // 授权按钮不可点击时背景颜色 默认值：#73aaf5（仅ios支持）  
									"textColor": "#ffffff", // 授权按钮文字颜色 默认值：#ffffff  
									"title": "本机号码一键登录", // 授权按钮文案 默认值：“本机号码一键登录”  
									"borderRadius": "24px" // 授权按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"otherLoginButton": {
									"visible": true, // 是否显示其他登录按钮，默认值：true  
									"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值：透明 
									"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值：透明 
									"textColor": "#656565", // 其他登录按钮文字颜色 默认值：#656565  
									"title": "其他登录方式", // 其他登录方式按钮文字 默认值：“其他登录方式”  
									"borderColor": "", //边框颜色 默认值：透明（仅iOS支持）  
									"borderRadius": "0px" // 其他登录按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"privacyTerms": {
									"defaultCheckBoxState": true, // 条款勾选框初始状态 默认值： true
									"isCenterHint": false, //未勾选服务条款时点击登录按钮的提示是否居中显示 默认值: false (3.7.13+ 版本支持)
									"uncheckedImage": "", // 可选 条款勾选框未选中状态图片（仅支持本地图片 建议尺寸 24x24px）(3.2.0+ 版本支持)   
									"checkedImage": "", // 可选 条款勾选框选中状态图片（仅支持本地图片 建议尺寸24x24px）(3.2.0+ 版本支持)   
									"checkBoxSize": 12, // 可选 条款勾选框大小，仅android支持
									"textColor": "#BBBBBB", // 文字颜色 默认值：#BBBBBB  
									"termsColor": "#5496E3", //  协议文字颜色 默认值： #5496E3  
									"prefix": "我已阅读并同意", // 条款前的文案 默认值：“我已阅读并同意”  
									"suffix": "并使用本机号码登录", // 条款后的文案 默认值：“并使用本机号码登录”  
									"privacyItems": [ // 自定义协议条款，最大支持2个，需要同时设置url和title. 否则不生效  
										{
											"url": "https://", // 点击跳转的协议详情页面  
											"title": "用户服务协议" // 协议名称  
										}
									]
								},
							},
							success: (res) => {
								console.log("一键登录调用返回的数据", res)
								// 云对象调用
								let data = {
									access_token: res.authResult.access_token,
									openid: res.authResult.openid
								}
								let loginInfo = univerify.univerifyLogin(data)
								console.log(loginInfo, '手机一键登录结果')
								uni.showToast({
									title: res.authResult,
									icon: "none"
								})
								// console.log("云函数调用返回数据", dataRes)
							},
							fail(err) {
								// 登录失败或者点击其他登录方式,自定义按钮等
								console.log("一键登录uni.login失败", err)
								uni.showToast({
									title: res.errMsg || err.metadata?.resultDesc,
									icon: "none"
								})

								setTimeout(() => {
									uni.closeAuthView() //关闭一键登录弹出窗口

								}, 500)
							}
						})
					},
					fail(res) {
						console.log("一键登录uni.preLogin失败", res)
						if (res.errMsg != "login:ok") {
							// 这里注意有个小坑: 不同运营商,返回的报错字段不同, 经过测试, 以下几乎包含了三大运营商报错字段
							uni.showToast({
								title: res.errMsg || res.metadata.resultMsg || res.metadata.error_data ||
									res.metadata.resultDesc || "请检查是否插入有效sim卡及开启蜂窝数据网络",
								icon: "none"
							})
						}
						//如果手机没有插入有效的sim卡，或者手机蜂窝数据网络关闭，
						//都有可能造成预登录校验失败。
					}
				})
			}

在这里插入图片描述
至此成功了

  • 完整代码

服务端unicloud代码index.obj.js

// 云对象教程: https://uniapp.dcloud.net.cn/uniCloud/cloud-obj
// jsdoc语法提示教程：https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/129
module.exports = {
	_before: function() { // 通用预处理器

	},
	
	async univerifyLogin(data) {
		let res = await uniCloud.getPhoneNumber({
			appid: '__UNI__EBC5FCF',
			provider: 'univerify',
			apiKey: 'xxxxxxxxx', // 在开发者中心开通服务并获取apiKey
			apiSecret: 'xxxxxx, // 在开发者中心开通服务并获取apiSecret
			access_token: data.access_token,
			openid: data.openid
		})
		return {
			code: 200,
			data: res.data,
			msg: '获取手机号成功'
		}
	}
}

客户端 univerifyLogin.vue代码

<template>
	<button @click="fastLoginFn">手机号一键登录</button>
</template>

<script>
	let univerify = uniCloud.importObject('login')
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
		methods: {
			fastLoginFn() {
				console.log("手机号一键登录")
				var this_ = this
				// 预登陆
				uni.preLogin({
					provider: "univerify",
					success: () => {
						uni.login({
							provider: "univerify",
							univerifyStyle: {
								"fullScreen": false, // 是否全屏显示，默认值： false
								"backgroundColor": "#ffffff", // 授权页面背景颜色，默认值：#ffffff
								"backgroundImage": "", // 全屏显示的背景图片，默认值："" （仅支持本地图片，只有全屏显示时支持）  
								"icon": {
									"path": "static/xxx.png" // 自定义显示在授权框中的logo，仅支持本地图片 默认显示App logo   
								},
								"closeIcon": {
									"path": "static/xxx.png" // 自定义关闭按钮，仅支持本地图片。 HBuilderX3.3.7+版本支持
								},
								"phoneNum": {
									"color": "#202020" // 手机号文字颜色 默认值：#202020  
								},
								"slogan": {
									"color": "#BBBBBB" //  slogan 字体颜色 默认值：#BBBBBB  
								},
								"authButton": {
									"normalColor": "#3479f5", // 授权按钮正常状态背景颜色 默认值：#3479f5  
									"highlightColor": "#2861c5", // 授权按钮按下状态背景颜色 默认值：#2861c5（仅ios支持）  
									"disabledColor": "#73aaf5", // 授权按钮不可点击时背景颜色 默认值：#73aaf5（仅ios支持）  
									"textColor": "#ffffff", // 授权按钮文字颜色 默认值：#ffffff  
									"title": "本机号码一键登录", // 授权按钮文案 默认值：“本机号码一键登录”  
									"borderRadius": "24px" // 授权按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"otherLoginButton": {
									"visible": true, // 是否显示其他登录按钮，默认值：true  
									"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值：透明 
									"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值：透明 
									"textColor": "#656565", // 其他登录按钮文字颜色 默认值：#656565  
									"title": "其他登录方式", // 其他登录方式按钮文字 默认值：“其他登录方式”  
									"borderColor": "", //边框颜色 默认值：透明（仅iOS支持）  
									"borderRadius": "0px" // 其他登录按钮圆角 默认值："24px" （按钮高度的一半）
								},
								"privacyTerms": {
									"defaultCheckBoxState": true, // 条款勾选框初始状态 默认值： true
									"isCenterHint": false, //未勾选服务条款时点击登录按钮的提示是否居中显示 默认值: false (3.7.13+ 版本支持)
									"uncheckedImage": "", // 可选 条款勾选框未选中状态图片（仅支持本地图片 建议尺寸 24x24px）(3.2.0+ 版本支持)   
									"checkedImage": "", // 可选 条款勾选框选中状态图片（仅支持本地图片 建议尺寸24x24px）(3.2.0+ 版本支持)   
									"checkBoxSize": 12, // 可选 条款勾选框大小，仅android支持
									"textColor": "#BBBBBB", // 文字颜色 默认值：#BBBBBB  
									"termsColor": "#5496E3", //  协议文字颜色 默认值： #5496E3  
									"prefix": "我已阅读并同意", // 条款前的文案 默认值：“我已阅读并同意”  
									"suffix": "并使用本机号码登录", // 条款后的文案 默认值：“并使用本机号码登录”  
									"privacyItems": [ // 自定义协议条款，最大支持2个，需要同时设置url和title. 否则不生效  
										{
											"url": "https://", // 点击跳转的协议详情页面  
											"title": "用户服务协议" // 协议名称  
										}
									]
								},
							},
							success: (res) => {
								console.log("一键登录调用返回的数据", res)
								// 云对象调用
								let data = {
									access_token: res.authResult.access_token,
									openid: res.authResult.openid
								}
								let loginInfo = univerify.univerifyLogin(data)
								console.log(loginInfo, '手机一键登录结果')
								// 云函数调用  (由于unicloud创建的是云对象，所以采用以下调用方式会报错----云函数报错,  Error: Method name required)
								// uniCloud
								// 	.callFunction({
								// 		name: "login", // 云函数名称
								// 		data: {
								// 			access_token: res.authResult.access_token, // 客户端一键登录接口返回的access_token
								// 			openid: res.authResult.openid // 客户端一键登录接口返回的openid
								// 		}
								// 	})
								// 	.then((dataRes) => {
								// 		console.log("云函数返回的参数", dataRes)
								// 		let phone = dataRes.result.data.phoneNumber
								// 		this.userPhone = dataRes.result.data.phoneNumber
								// 		// 这里进行登录操作
								// 	})
								// 	.catch((err) => {
								// 		console.log("云函数报错", err)
								// 		uni.showToast({
								// 			title: err.errMsg,
								// 			icon: "none"
								// 		})
								// 		this_ = this
								// 		setTimeout(() => {
								// 			uni.closeAuthView() //关闭一键登录弹出窗口
								// 		}, 500)
								// 	})
								uni.showToast({
									title: res.authResult,
									icon: "none"
								})
								// console.log("云函数调用返回数据", dataRes)
							},
							fail(err) {
								// 登录失败或者点击其他登录方式,自定义按钮等
								console.log("一键登录uni.login失败", err)
								uni.showToast({
									title: res.errMsg || err.metadata?.resultDesc,
									icon: "none"
								})

								setTimeout(() => {
									uni.closeAuthView() //关闭一键登录弹出窗口

								}, 500)
							}
						})
					},
					fail(res) {
						console.log("一键登录uni.preLogin失败", res)
						if (res.errMsg != "login:ok") {
							// 这里注意有个小坑: 不同运营商,返回的报错字段不同, 经过测试, 以下几乎包含了三大运营商报错字段
							uni.showToast({
								title: res.errMsg || res.metadata.resultMsg || res.metadata.error_data ||
									res.metadata.resultDesc || "请检查是否插入有效sim卡及开启蜂窝数据网络",
								icon: "none"
							})
						}
						//如果手机没有插入有效的sim卡，或者手机蜂窝数据网络关闭，
						//都有可能造成预登录校验失败。
					}
				})
			}

		}
	}
</script>

<style>
</style>

飞机直达gitee😀

大笨熊不熊
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
专栏目录
uniapp使用一键登录(前后端两种实现全过程、附代码)
Jk200165的博客
05-31 1124
1.开通uni一键登录、开通服务空间。
使用ivx开发web全栈项目 初探（一）
xiongwn的博客
09-03 1万+
一、前言 本人是一枚喜欢探索黑科技的web前端，没事喜欢研究研究框架，了解网络技术/工具等等。最近在研究saas和paas的时候在知乎专栏有大佬提到了一款在线页面编辑系统——ivx。看到这里在做的大佬估计表示不屑，不就是在线编排h5的工具网站嘛，这种东西国内不多得是：135编辑器、秀米、易点，大同小异都是集成的富文本编辑器，允许你使用封装好的事件触发器、动画效果、自定义css样式，感觉没什么技术含...
【uniapp】unicloud云开发获取token 一键登录
bjxlyy的博客
06-13 1120
无论是用微信开发者工具还是uniapp开发小程序，基本上所有情况之下，登录是必不可少的。简洁明了，直接开始。
uniapp全栈之初探unicloud
一名渣渣程序员
06-28 203
uniapp全栈工程师之初探unicloud
Android 手机克隆/一键换机原理初探
IT先森
07-04 7664
      Android 手机克隆/一键换机原理初探 前言   最近换了一个表，错了换了一个手机。大家都知道换手机是一个很开心的事情，但是在换手机过程中原来手机App信息，多媒体信息等切换时一件很麻烦和耗时的事情。偶然发现手机自带了手机克隆功能，这个非常方便的解决了我们上述的痛点今天我们初步研究一下怎么实现上述的功能。 一. 具体实现 我们知道手机需要迁移的数据一般是多媒体和App数据，...
android一键换机功能实现,Android 手机克隆/一键换机原理初探
weixin_32563347的博客
05-26 2093
Android 手机克隆/一键换机原理初探前言最近换了一个表，错了换了一个手机。大家都知道换手机是一个很开心的事情，但是在换手机过程中原来手机App信息，多媒体信息等切换时一件很麻烦和耗时的事情。偶然发现手机自带了手机克隆功能，这个非常方便的解决了我们上述的痛点今天我们初步研究一下怎么实现上述的功能。一. 具体实现我们知道手机需要迁移的数据一般是多媒体和App数据，那么我们就分别从这两个方面入手。...
Spring之初探Spring框架
沉淀、分享、成长，让自己和他人都能有所收获！
08-21 2万+
本篇博客将带您深入了解Spring框架的核心特点和优势，以及如何进行环境配置并创建您的第一个Spring应用程序。从入门到实践，让您迈出掌握Spring框架的第一步。Spring框架为Java开发带来了强大的支持，它的优势包括灵活的配置、松耦合的组件和广泛的社区支持。通过正确的环境配置和第一个Spring应用程序的创建，您将迈向深入掌握Spring框架的旅程。Spring官方网站如对本文内容有任何疑问、建议或意见，请联系作者，作者将尽力回复并改进📓；(联系微信:Solitudemind )
Redis源码初探之数据结构
mlydaemon的专栏
01-18 4097
Redis可以存储键和5种不同类型的数据结构，它们是STRING（字符串）,lIST（列表）,SET（集合）,HASH（散列表）,ZSET（有序集合）。 1.字符串（String）可以是字符串、整数或者浮点数。Redis对整个字符串或者其中部分执行操作。对整数和浮点数执行自增或者自减操作。 2.链表（List）链表的每个节点都包含一个字符串.Redis可以从链表两端插入或者弹出元素。 /*链表...
uniapp多端构建实战初探
kuaidi100的博客
09-01 2741
一、背景 小程序具有跨平台、体验好、高灵活性以及即用即走、无需下载安装诸多优势。随着微信团队推出微信小程序，国内各大互联网团队也相继推出了各自的小程序，手机厂商也联合推出了快应用。但由于各种原因，各团队的小程序，并没有形成统一的标准或联盟，导致部分平台差异化大，要实现多个平台的小程序就得写多套小程序代码，这给开发者和企业带来不少额外的负担。这种情况下，一个多端统一的解决方案就显得尤为重要。统一多端标准后，让一处代码，多处运行成为了可能，而uniapp作为国内小程序的开创者，也制定了一套基于Vuejs的解决方
初探uniapp，做了第一个项目，总结下经验（一）
热门推荐
欧阳的技术博客
03-18 4万+
uniapp是个啥 1.基于vue开发的（懂vue的朋友问题是不大的） 2.跨端：小程序，H5，QQ小程序啥的都可以用（会有小坑，毕竟兼顾这么多端） 3. 4.没有啥效果很棒组件，几乎都要自己写，也不建议去用其它花里胡哨的，容易出问题（能简则简） 5.uniapp是多页，vue是单页 我的实战开发之旅 1.文档是要看的，我看了大半天吧（常用组件以及事件机制等） 2.开发工具用的VScode（npm构造），建议还是.hbuilderx，毕竟是官方推荐 3.先下载个模...
MySQL源代码的海洋中游弋初探MySQL之SQL执行过程
03-02
2012年5月12日，MySQL技术群-北京技术圈的MySQL爱好者，聚集搜狐公司，举办MySQL数据库技术沙龙，本文内容为搜狐DBA团队古雷（外号：古大师，因研究佛学而来）分享的MySQL之SQL执行过程，先整理成文章的方式供大家...
自动测试之关键字驱动测试模式初探
03-23
自动测试之关键字驱动测试模式初探。曾经在“我看测试”这篇文章中论述过，“测试效率的提高关键是测试手段的改进”。尤其在软件测试领域，没有千遍一律的测试方法，别人都说好的商业工具拿到你产品线来却未必合适。...
黄河二号离心泵抗磨蚀措施初探.zip
03-28
黄河二号离心泵抗磨蚀措施初探 简述了泥沙对水泵过流部件磨蚀的影响，特别是泥沙磨蚀和空蚀的联合作用导致水泵过流部件的严重破坏。针对黄河二号离心泵在高含沙水流运行条件下磨蚀破坏的基本形式和主要部件，结合...
进阶之初探nodeJS
12-23
so，该篇随笔是建立在”初探nodeJS”之上的，固取名为”进阶之初探nodeJS”。 好了，侃了这多，那么我们即将实现一个什么样的示例呢？ 示例说明，如下： 用户通过url之127.0.0.1/login进入登入页面，待用户输入账户...
uni-app基本的数据绑定v-bind,v-for,v-on:click
蚂蚁搬家
07-25 404
数据绑定事件
uniapp手写滚动选择器
肥晨开发的学习之路
07-25 825
欢迎关注我获取前端学习资源，日常分享技术变革，生存法则；行业内幕，洞察先机。没有符合项目要求的选择器 就手写了一个。
uni-app全局文件与常用API
2301_80735340的博客
07-25 1236
超时时间，单位为ms。也就是说，在拿到设计稿后，要把稿件宽度等比缩放为750，再测量各区域的大小。下拉刷新操作，需要在 pages.json 里，找到的当前页面的pages节点，并在 style 选项中开启 enablePullDownRefresh。这段代码中我们开始了输入框，在输入框中输入内容，点击确定后，可以回调输入的内容，拿到后我们可以做些输入判断、校验之类的操作。打开后，里面有很多内置的样式变量，可以直接拿来用的，现在拿个文字颜色过来试试，注意只需要取"$“至”:" 前的内容即可。
Java面试整理，涵盖基础、JVM、线程并发、框架、MySQL、微服务、Redis、中间件、数据结构与算法等。陆续完善中.zip
最新发布
07-31
Java面试整理，涵盖基础、JVM、线程并发、框架、MySQL、微服务、Redis、中间件、数据结构与算法等。陆续完善中
uniapp 电子印章_初探uni-app框架 踩坑
06-08
好的，让我来回答你的问题。 关于 uniapp 电子印章和初探 uni-app 框架踩坑，我可以为你提供一些初步的信息。 首先，uniapp 是一款跨平台开发框架，可以同时开发出 Android 和 iOS 两个平台的应用程序。它的开发语言是 Vue.js，使用了一些基于 Vue.js 的特性和语法。 在使用 uniapp 开发电子印章的过程中，你可能会遇到一些坑，比如在使用 Canvas 绘图时需要注意 Canvas 的宽高和设备像素比的问题，需要使用 uni.createSelectorQuery().select() 方法来获取 Canvas 的实际宽高等等。 此外，在初探 uni-app 框架时，你需要了解 uni-app 的项目结构、组件、路由等方面的知识，这些都可以在 uni-app 的官方文档中找到详细的介绍和教程。 总之，uniapp 是一款非常强大的跨平台开发框架，但在使用过程中也有一些需要注意的地方。希望我的回答能对你有所帮助。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大笨熊不熊

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值