腾讯云低代码实战:个人信息修改

上一篇我们基本搭建了个人信息管理的框架，实现了后端API的编写，以及前端界面的搭建。本篇我们就介绍一下个人信息修改的功能。

1 上传素材

用户打开我的页面，默认是未登录的状态，需要显示一个默认头像。用大模型生成一个头像的素材，然后上传到素材管理里。

2 设置默认头像

如果从全局变量里获取不到头像，说明用户还未注册，我们就使用短路或运算符来显示一下我们的默认头像

先从素材里复制一下图片的路径

然后选中我们的图片组件，添加这个路径

$w.app.dataset.state.userData?.userInfo?.avatarUrl||"https://lowcode-5gjsvmcpbf91914b-1256989349.tcloudbaseapp.com/resources/2025-05/lowcode-2285650"

短路或运算符的计算规则是先看左边表达式的值，如果返回false就计算右边表达式的值

3 设置默认昵称

当用户未注册的时候，昵称我们显示一个匿名用户，选中文本组件，也是用短路运算符设置一下

$w.app.dataset.state.userData?.userInfo?.nickname||"匿名用户"

4 设置注册按钮

当用户未注册的时候，我们的按钮设置为注册用户，需要添加一个普通容器，将原来的修改用户的按钮移入，然后再添加一个获取手机号的组件

两个按钮是一个互斥关系，一种状态只显示一个按钮。我们可以通过按钮的条件展示来设置

给修改用户按钮设置为如下的表达式

$w.app.dataset.state.userData?.isRegistered

当用户已经注册的时候我们就显示修改按钮

给获取手机号设置如下表达式

!$w.app.dataset.state.userData?.isRegistered

这里我们用到了取反运算符，这样如果是未注册表达式计算结果就是true，这样注册按钮就显示了

最终的状态

在未获取到用户信息的时候，我们显示默认头像和注册用户按钮

如果用户已经注册，则显示真实的用户昵称，并且显示修改信息的按钮

总结

本篇我们介绍了用户在未登录和登录状态下视图的切换，主要是通过设置组件的表达式，通过短路运算符和取反运算符来控制在不同视图下的显示效果。这两种语法是表达式里常见高频用法，还需要熟练掌握才可以。