我们首先在首页放置一个数据列表组件拿来展示我们的文章列表,数据源选择文章表
将文章的标题绑定到标题数组上
接着绑定发布日期
然后选中设置了循环展示的普通容器,绑定一个点击风波,传入当前记录的数据标示
事件选择平台方式的跳转,需要先新建一个页面参数
参数构建以后我们绑定为当前记录的数据标示
5 详情页功能实现
切换到详情页,我们可以使用区块模板实现,添加一个内容详情区块
我们须要定义一个变量来获取当前文章的信息,变量的类型选择模型变量,方法选择查询单条,并且绑定我们的参数变量
将文章的标题绑定为我们变量中的标题
发布日期绑定为变量中的发布日期
把正文绑定为我们变量中的内容
将按键的文字改为关注
6 获取用户的openid
小程序一启动的时侯就可以获取用户的openid,我们先须要定义一个全局变量拿来储存
在低码编辑器的全局生命周期里加入获取用户openid的代码
export default { async onAppLaunch(launchOpts) { //console.log("---------> LifeCycle onAppLaunch", launchOpts) const { OPENID, FROM_OPENID } = await app.utils.getWXContext() let userId = FROM_OPENID || OPENID app.dataset.state.openid = userId console.log(app.dataset.state.openid) }, onAppShow(appShowOpts) { //console.log("---------> LifeCycle onAppShow", appShowOpts) }, onAppHide() { //console.log("---------> LifeCycle onAppHide") }, onAppError(options) { //console.log("---------> LifeCycle onAppError", options) }, onAppPageNotFound(options) { //console.log("---------> LifeCycle onAppPageNotFound", options) }, onAppUnhandledRejection(options) { //console.log("---------> LifeCycle onAppUnhandledRejection", options) } }
7 设置关注的低码方式
我们在详情页点击关注按键时,调用关注的低码方式,逻辑是传入当前变量的数据标示,取得用户的openid写入数据源
export default async function({event, data}) { const result = await app.cloud.callModel({ name:"gz_necsx6t", methodName:"wedaCreate", params:{ wzbs:data.target, openid:app.dataset.state.openid } }) $page.widgets.id20.text = "已关注" }
然后在容器上设置点击风波,调用低码方式,参数传入页面的参数变量
这样整体就做好了
8 发布预览
点击发布按键,发布成测试版,在手机上进行测试,可以看见当前关注数据源早已写入了数据
9 总结
我们本篇介绍了怎样实现文章的关注功能,要想实现关注功能首先要设计好数据源,然后传入正确的参数,在低码方式中写入数据源即可。
到此这篇关于陌陌小程序实现文章关注功能详尽流程的文章就介绍到这了,更多相关小程序关注功能内容请搜索云海天教程原先的文章或继续浏览下边的相关文章希望你们之后多多支持云海天教程!