当前位置:网站首页>Realize the attention function of the article in the applet
Realize the attention function of the article in the applet
2022-07-05 04:05:00 【Low code preacher】
Catalog
A common scenario in social applets is to focus on functions , In this article, we will focus on the published articles as an example , Explain how to realize the focus function .
1 Data source design
Low code tools are divided into two types: model driven and form driven , Micro build low code is a model driven low code tool . The so-called model driven is to design the data source first , Design the relationship between data sources . Let's analyze what the relationship is , There should be a data source for the article , There is also a data source of concern . The relationship between articles and concerns is one to many , The so-called one to many refers to an article that can be followed by multiple people .
1.1 Article data source
We can design the fields of the article data source , It's the title 、 Release date 、 Content . According to the design, we create data sources and corresponding fields
1.2 Focus on data sources
Pay attention to the data source. We need to store the data ID of the article and the user's openid
2 Enter test data
After the data source is created, we , First, add some test data to the article table . Click more of data sources , Click management data to enter
3 Create an
After the data source is created , We can develop small programs . Click Apply on the console , Create a custom application
Click the blank page to complete the creation of the home page
We need a detail page to show the details of the article , Click... Next to the page +
To complete the creation of the new page
4 Home page function realization
We first place a data list component on the home page to display our article list , Data source selection article table
Bind the title of the article to the title field
Then bind the release date
Then select the ordinary container with circular display , Bind a click event , Pass in the data ID of the current record
Jump of event selection platform method , You need to create a new page parameter first
After the parameter is established, we bind it to the data ID of the current record
5 Details page function realization
Switch to the details page , We can use block template to realize , Add a content detail block
We need to define a variable to get the information of the current article , Select the model variable according to the type of variable , Method select query single , And bind our parameter variables
Bind the title of the article to the title in our variable
The release date is bound to the release date in the variable
Bind the body to the contents of our variables
Change the text of the button to follow
6 Get the user's openid
As soon as the applet starts, it can get the user's openid, We need to define a global variable to store
Add getting users in the global life cycle of the low code editor openid Code for
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 Set the low code method of concern
When we click the follow button on the details page , Call the concerned low code method , Logic is the data identification passed into the current variable , Get the user's openid Write to data source
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 = " Followed "
}
Then set the click event on the container , Call low code method , Parameter the parameter variable passed into the page
In this way, the whole is done
8 Release preview
Click the Publish button , Released as a beta , Test it on your phone , You can see that the current concerned data source has written data
9 summary
This article introduces how to realize the attention function of the article , To realize the attention function, we must first design the data source , Then pass in the correct parameters , Write the data source in the low code method . If it works , Remember the praise. 、 Follow and comment .
边栏推荐
- ClickPaaS低代码平台
- How to solve the problem that easycvr changes the recording storage path and does not generate recording files?
- Use threejs to create geometry and add materials, lights, shadows, animations, and axes
- provide/inject
- MindFusion.Virtual Keyboard for WPF
- Clickpaas low code platform
- 一文带你了解BI的前世今身与企业数字化转型的关系
- Three level linkage demo of uniapp uview u-picker components
- 测试开发是什么?为什么现在那么多公司都要招聘测试开发?
- Assembly - getting started
猜你喜欢
@Transactional 注解导致跨库查询失效的问题
Is "golden nine and silver ten" the best time to find a job? Not necessarily
10种寻址方式之间的区别
Rust blockchain development - signature encryption and private key public key
[software reverse analysis tool] disassembly and decompilation tool
Why can't all browsers on my computer open web pages
测试开发是什么?为什么现在那么多公司都要招聘测试开发?
An elegant program for Euclid‘s algorithm
C language course setting: cinema ticket selling management system
Plasticscm enterprise crack
随机推荐
The development of mobile IM based on TCP still needs to keep the heartbeat alive
lds链接的 顺序问题
The order of LDS links
特殊版:SpreadJS v15.1 VS SpreadJS v15.0
JWT vulnerability recurrence
Special Edition: spreadjs v15.1 vs spreadjs v15.0
Timing manager based on C #
Online text line fixed length fill tool
Threejs realizes the drawing of the earth, geographical location annotation, longitude and latitude conversion of world coordinates threejs coordinates
Analysis of dagger2 principle
ABP vNext microservice architecture detailed tutorial - distributed permission framework (Part 1)
Threejs Internet of things, 3D visualization of farms (I)
Why is there a reincarnation of 60 years instead of 120 years in the tiangan dizhi chronology
ABP vNext microservice architecture detailed tutorial - distributed permission framework (Part 2)
[software reverse - basic knowledge] analysis method, assembly instruction architecture
Differences among 10 addressing modes
已解决(sqlalchemy+pandas.read_sql)AttributeError: ‘Engine‘ object has no attribute ‘execution_options‘
Soul 3: what is interface testing, how to play interface testing, and how to play interface automation testing?
输入的查询SQL语句,是如何执行的?
Threejs realizes sky box, panoramic scene, ground grass