当前位置：网站首页>[wechat applet] collaboration and publishing data binding

jurisdiction	The operator	developer	Data Analyst
Developer rights		√
Experience authority	√	√	√
Sign in	√	√	√
Data analysis			√
Wechat payment	√
Extension	√
Development management	√
Development and setup		√
Temporarily Out of Service	√
The official account No.	√
Tencent cloud management		√
Widget plugin	√
Game operation management	√

3. developer Permission description of

① Developer rights ： You can use applet developer tools and code development for applet functions

② Experience authority ： You can use the experience applet

③ Login rights ： Can log in small program management background , Administrator confirmation is not required

④ Development and setup ： Set applet server domain name 、 Message push and scan ordinary link QR code to open applet

⑤ Tencent cloud management ： Cloud development related settings

4. add to Members of the project and Experience members

Collaborative work and release - The version of the applet

1. Different versions in the software development process

In the process of software development , According to different time nodes , Different software versions will be produced , for example ：

① While developers write code , Self test the project code （ Development version ）

② Until the program reaches a stable and experiential state , The developer gives the experience version to the product manager and testers Experience test

③ Finally, the program is repaired Bug after , Release the official version For external users

2. The version of the applet

Version stage	explain
Development version	Use developer tools , You can upload the code to the development version . The development version only keeps the latest uploaded code of each person . Click submit for review , The code can be submitted for review . The development version can be deleted , It does not affect the code of the online version and the version under review .
Experience version	You can select a development version as the experience version , And choose an experience version .
Version under review	There can only be one copy of the code under review . The audit results can be published online , You can also resubmit for approval directly , Overwrite the original approved version .
Online version	The version of the code used by all users online , The version code is updated after the new version code is released .

Collaborative work and release - Published online

1. The overall steps of launching the applet

The release of a small program goes online , It usually goes through Upload code -> Submit audit -> Release These three steps .

2. Upload code

① Click... In the toolbar at the top of the developer tool “ Upload ” Button

② Fill in Version number as well as Project remarks

3. View the uploaded version in the background

Login applet management background -> management -> version management -> Development version , You can view the version submitted and uploaded just now ：

4. Submit audit

Why submit for review ： In order to ensure the quality of small programs , And comply with relevant specifications , The release of small programs needs to be reviewed by Tencent .

How to submit for review ： In the list of development versions , Click on “ Submit audit ” After the button , Fill in the relevant information according to the prompts on the page , You can submit the applet to Tencent official for review .

5. Release

After approval , The administrator will receive the notification that the applet has passed the audit in the wechat , In the list of approved versions , Click on “ Release ” After the button , You can “ Approved by ” The version of is released as “ Online version ”, For all applet users to access and use .

6. Promotion based on small program code

Compared with ordinary QR code , The advantages of applet code are as follows ：

① More in style recognizable and Visual impact

② Can more clearly set up a small program The brand image

③ Can help developers Better promote applets

Get applet code 5 A step ：

Login applet management background -> Set up -> Basic settings -> essential information -> Download applet codes and offline materials

Collaborative work and release - Operational data

1. There are two ways to view applet operation data

① stay “ Applet background ” see

1. Login applet management background

2. Click... On the sidebar “ Statistics ”

3. Click the corresponding tab You can see the relevant data

② Use “ Applet data assistant ” see

1. Open the WeChat

2. Search for “ Applet data assistant ”

3. View data related to published applets

WXML Template syntax - Data binding

1. Basic principles of data binding

① stay data Data defined in

② stay WXML Using data in

2. stay data Define the data of the page in

On the page corresponding to .js In file , Define data to data In the object ：

This is the default index page ：

// index.js
//  Get application instance 
const app = getApp()

Page({
  data: {
    motto: 'Hello World',
    userInfo: {},
    hasUserInfo: false,
    canIUse: wx.canIUse('button.open-type.getUserInfo'),
    canIUseGetUserProfile: false,
    canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') //  To try to get user information, change to false
  },
  //  Event handler 
  bindViewTap() {
    wx.navigateTo({
      url: '../logs/logs'
    })
  },
  onLoad() {
    if (wx.getUserProfile) {
      this.setData({
        canIUseGetUserProfile: true
      })
    }
  },
  getUserProfile(e) {
    //  Recommended wx.getUserProfile Get user information , Every time the developer obtains the user's personal information through the interface, the user needs to confirm , Developers keep the nicknames of avatars that users fill in quickly , Avoid repeated pop ups 
    wx.getUserProfile({
      desc: ' Display user information ', //  Declare the purpose of obtaining the user's personal information , The follow-up will be shown in the pop-up window , Please fill in carefully 
      success: (res) => {
        console.log(res)
        this.setData({
          userInfo: res.userInfo,
          hasUserInfo: true
        })
      }
    })
  },
  getUserInfo(e) {
    //  It is not recommended to use getUserInfo Get user information , Estimated from 2021 year 4 month 13 The date of ,getUserInfo Pop ups will no longer pop up , And directly return the anonymous user's personal information 
    console.log(e)
    this.setData({
      userInfo: e.detail.userInfo,
      hasUserInfo: true
    })
  }
})

Create a new page , open js file

Page({

  data: {
    word:" Content "
  }

})

3. Mustache The format of grammar

hold data The data in is bound to render in the page , Use Mustache grammar （ Double brace ） Just wrap the variables . The grammar format is ：

<view>{ { The name of the data to be bound }}</view>

4. Mustache Application scenario of Syntax

Mustache The main application scenarios of syntax are as follows ：

Binding content

WXML:

<view>{
            {word}}</view>

WXSS:

Page({

  data: {
    word:" Roll up   To rush "
  }

})

effect ：

Binding properties

WXML:

<image src="{
            {image}}" mode="widthFix"></image>

WXSS:

Page({

  data: {
 
    image:"/image/a.jpg"
  }

})

effect ：

The ternary operation

The data of the page is as follows ：

Page({

  data: {
 
   randomNum:Math.random()*100
  }

})

The structure of the page is as follows ：

<view>{
             {randomNum>=50 ? ' Greater than or equal to 50':' Less than 50'}}</view>

The generated random number is ：97.50952738069331>50

Arithmetic operations