加油站小程序实战教程10开通会员

我们上一篇搭建了开通会员的界面，有了界面的时候就需要加入一些逻辑来控制界面显示。我们的逻辑是当用户打开我的页面的时候，在页面加载完毕后调用API看用户是否已经开通会员了，如果未开通就显示我们已经搭建好的界面。

1 修改用户登录逻辑

在用户登录教程中，我们已经实现了用户登录的API。但是在会员管理中，我们又增加了一张会员表，并且将会员的信息和用户信息进行了关联，因此需要完善一下登录逻辑，加入是否是会员的判断，输入如下代码

const ErrorCode = {SUCCESS: 0,PARAM_ERROR: 1001,SYSTEM_ERROR: 1003,USER_NOT_FOUND: 1005 // (Optional, if using the second return style below)
};module.exports = async function (params, context) {const { openid } = params;if (!openid) {return { code: ErrorCode.PARAM_ERROR, message: '参数错误: openid 不能为空' };}try {// 1. 查询用户基础信息const user = await context.callModel({name: "users",methodName: "wedaGetItemV2",params: {filter: { where: { $and: [{ openid: { $eq: openid } }] } },select: { $master: true } // Or specify fields including _id},});// 2. **修正后的用户存在检查**// 检查 user 是否为 null/undefined 或者是一个空对象 {}// 方法一：检查对象是否有 key (推荐)const userExists = user && Object.keys(user).length > 0;// 方法二：检查是否存在关键字段 (例如 _id), 如果 _id 总是存在的话// const userExists = user && user._id;if (!userExists) {// 用户不存在console.log(`用户不存在或返回空对象: openid=${openid}, user=`, user);return {code: ErrorCode.SUCCESS,data: {userExists: false,isMember: false}};// 或者如果你想明确区分错误码：// return { code: ErrorCode.USER_NOT_FOUND, message: '用户不存在' };}// 3. 用户存在，查询会员信息const member = await context.callModel({name: "members", // *** 修改为你的会员表名 ***methodName: "wedaGetItemV2",params: {filter: { where: { $and: [{ user_id: { $eq: user._id } }] } }, // *** 确认关联字段 ***select: { $master: true } // Or specify needed member fields}});// 4. **修正后的会员存在检查**// 检查 member 是否为 null/undefined 或者是一个空对象 {}// 方法一：检查对象是否有 key (推荐)const isMember = member && Object.keys(member).length > 0;// 方法二：检查是否存在关键字段 (例如 _id), 如果 _id 总是存在的话// const isMember = member && member._id;// 5. 构建返回结果if (isMember) {// 用户存在且是会员return {code: ErrorCode.SUCCESS,data: {userExists: true,isMember: true,userInfo: user,memberInfo: member}};} else {// 用户存在但不是会员 (member 为 null/undefined 或 {})console.log(`用户存在但非会员或会员信息为空对象: openid=${openid}, member=`, member);return {code: ErrorCode.SUCCESS,data: {userExists: true,isMember: false,userInfo: user,memberInfo: null // 保持返回 null 表示无会员信息}};}} catch (error) {console.error("查询用户及会员信息时出错:", error);return {code: ErrorCode.SYSTEM_ERROR,message: '系统查询出错，请稍后重试'};}
};

在现有的用户管理模块的登录方法，我们增加了是否是会员的判断

2 创建变量

有了API之后，就需要考虑如果接收调用结果的问题，我们在我的页面创建变量用来接收API的返回结果

先创建一个布尔值变量用来存储用户是否存在

再定义一个变量用来存储会员是否存在

再添加一个变量用来存储用户信息

再添加一个变量用来存储会员信息

3 调用API

变量创建好了之后，我们再创建一个javascript方法，用来调用我们的API，输入如下代码

export default async function ({ event, data }) {try {const userInfo = await $w.auth.getUserInfo()const openid = userInfo.openIdif (!openid) {console.error("OpenID 未获取");// 可能需要引导用户登录或授权$w.utils.showToast({title: "请先登录",icon: "error",duration: 1000});return;}// 调用你修改后的云函数/APIconst res = await $w.cloud.callDataSource({dataSourceName: 'userManagement_nqq7c6l',methodName: 'login',params: {openid: openid}, // 方法入参});if (res.code === 0) { // ErrorCode.SUCCESSconst { userExists, isMember, userInfo, memberInfo } = res.data;if (!userExists) {// 用户在系统中完全不存在，可能需要特殊处理，比如跳转到登录/注册页console.log("用户不存在于系统中");// 根据你的业务逻辑决定是否显示“开通会员”视图，或者其他操作$w.page.dataset.state.userExists = false$w.page.dataset.state.isMember = false} else {// 用户存在，根据是否是会员来设置视图$w.page.dataset.state.userExists = true$w.page.dataset.state.userInfo = userInfoif (isMember) {// 可以在这里做一些会员视图的额外初始化（如果需要）console.log("用户是会员，余额：", memberInfo.balance); // 假设有 balance 字段$w.page.dataset.state.isMember = true$w.page.dataset.state.memberInfo = memberInfo} else {// 可以在这里做一些非会员视图的额外初始化console.log("用户非会员");$w.page.dataset.state.isMember = false}}} else {// API 返回错误console.error("获取用户会员状态失败:",res.code, res.message);$w.utils.showToast({title: (res.message || "加载失败，请稍后重试"), // 显示错误提示icon: 'error',duration: 1000})// 根据情况，可能也需要设置 showMemberView 为 false 或显示一个错误状态$w.page.dataset.state.isMember = false}} catch (err) {console.error("调用 API 出错:", err);$w.utils.showToast({title: "网络或服务异常，请重试",icon: "error",duration: 1000});$w.page.dataset.state.isMember = false} finally {// 可能需要在这里隐藏加载中的提示 (loading)// hideLoading();}
}

选中页面组件，设置onShow事件，调用我们的自定义方法

然后给我们会员开通的视图绑定条件展示即可

总结

本篇我们介绍了控制会员开通视图是否展示的功能。先修改了我们用户登录的逻辑，然后创建变量用来接收API返回结果。接着创建了自定义方法调用我们的API，最后给会员开通视图绑定了条件展示。

总体上像这种有权限判断的功能都是要写前后端逻辑的，这就要求你具备全栈的开发能力，否则是做不出来的。