Home > Article > WeChat Applet > Original experience in WeChat mini program development
Original experience in WeChat mini program development
- 高洛峰Original
- 2017-02-16 10:24:341461browse
1: Parameter value transfer method
1: data-id
We can add data-* attributes to HTML elements to pass the value we need, usage instructions :
(1)Set data-id
(2): Get value + pass value
playTap:function(e) {
const dataset = e.currentTarget.dataset;
wx.navigateTo({
urll: '../play/index?id='+ dataset.id
##}) Console.log (dataset.id);# # }
(3): Value
onLoad:function (param) {
//Page initialization
This.setData({
Currentid: Param.id
})
}
Data-Note: Data-Name cannot have capital letters, I used to have a capitalized Letter, I found this error after searching for a long time. Objects cannot be stored in the data-* attribute
2: Set the method identifier of id to pass the value
Instructions for use:
(1) Set id
(2) Value
Get through e.currentTarget.id Set the value of the id, and then pass the value by setting the global object
3: Add parameters in the navigator to pass the value
Usage instructions
(1) Pass the value: in the properties of the navigator After splicing the url?id (parameter name) = the value to be passed (if multiple parameters are separated by & &name=value&.....)
(2)Value:
onLoad (params){
app.Fetch (API.Detail + Params.id, (Er, Data) = & GT; {
##}) }## 2: Data request Encapsulation
1. Put all interfaces in a unified js file and exportconst api = {
interface1: 'https://..... ',
interface2: 'https://....',
interface3: 'https://....',
. ....
}
module.exports = api;
2: Create a method to encapsulate the request data in app.js
fetch( url,data, callback) {
wx.request({
url,
data: data,
header: {
'Content-Type': 'application/json'
},
success(res) {
callback(null, res.data);
},
# Fail (E) {
Callback (e);
}
##}) },3: Call the encapsulated method in the sub-page to request dataimport API from "../../api/api.js";const app = getApp ();const conf = { data:{ title:'Loading...', loading:true }, onLoad (){ app.fetch(API.hot,{},(err,data) => { } )},Three: Use templates (I found that templates are such a good thing!)1: Define template: name set the name of the template
Define template
First introduce the template
Then use template is and then write the name of the template.. Pass the required data through data
Four: Array’s more useful properties and methods
The Array.isArray() method is used to determine whether a value is an Array. If so, returns true, otherwise returns false.
concat() method combines the incoming array or non-array value with the original array to form a new array and returns it.
forEach() method executes the provided function (callback function) once for each element of the array ).
join() method joins all elements in the array into a string.
keys() method returns an iterator of array indexes.
map() method returns a new array consisting of the return value of each element in the original array after calling a specified method
pop() method deletes the last element in an array and returns this element .
push() method adds one or more elements to the end of the array and returns the new length of the array (length attribute value).
toString() returns a string representing the specified array and its elements.
5: Common methods of Object
1 Initialization method
var obj = [];
var obj = new obj();
var obj = Object.create(null);
2 Method of adding elements
dic[“key”] = “value”;
3 Method of deleting key
delete dic[“key”];
4 Clear all entries of the word
dic.clear();
5 Delete
delete dic;
6 Method to view all attributes
Object.keys(obj);
All key names of the object are strings, so they can be viewed with or without quotes. Yes, if the key name is a numeric value, it will be automatically converted to a string. However, if the key name does not meet the conditions of the identification name (for example, the first character is a number, or contains spaces or operators), and it is not a number, you must add Quotation marks, otherwise an error will be reported
6 Read attributes
obj.name || obj['name']
Note: Dot operators cannot be used for numerical key names ( Because it will be treated as a decimal point), only the square bracket operator can be used.
7 Check whether the variable is declared
if(obj.name) || if(obj['name'])
8 The in operator is used to check whether the object contains If a certain attribute is included, it returns true, otherwise it returns false
if ('x' in obj) {return 1}
9 for … in Loop
Used to traverse an object All attributes
for (var i in obj) {
console.log(obj);
}
10 with statement
Function: When operating multiple attributes of the same object, some writing convenience is provided
with(obj) {
name1 = 1;
name2 = 2;
}
Equivalent to
obj.name1 = 1;
obj.name2 = 2;
More original experience in WeChat mini program development For related articles, please pay attention to the PHP Chinese website!
Related articles
See more- WeChat Mini Program Simple DEMO layout, logic, and style exercises
- Detailed explanation and examples of WeChat applet wx.request (interface calling method)
- WeChat Mini Program - Detailed explanation of WeChat login, WeChat payment, and template messages
- WeChat applet (application account) simple example application and detailed explanation of the example
- Detailed explanation of WeChat applet for loop