Home > WeChat Applet > Mini Program Development > Summary of WeChat Mini Program Development Experience

Summary of WeChat Mini Program Development Experience

高洛峰
Release: 2017-03-22 15:47:09
Original
1301 people have browsed it

The learning time is not short. Today, the company will not work overtime to summarize my development experience. The following is a summary that I think is very important! I wrote it down so that I can remember it more clearly. At the same time, I hope it can help those in need. Classmate


1: Parameter value transfer method

1: data-id

We can add data-* attributes to HTML elements to pass what we need Value, usage instructions:
(1) Set data-id

(2): Get value + pass value

playTap:function(e) {

const dataset = e.currentTarget.dataset;

wx .navigateTo({

                                                                                                                                                                                                                                        .

}

(3): Value

onLoad:function (param) {

//Page initialization

This. setData({

                                                                                                                                        ) :data-* names cannot have capital letters. Once I found this error after searching for a long time because of a capital letter. Objects cannot be stored in data-* attributes

2: Settings Use the method identifier of id to pass the value

Instructions for use:

(1)Set id

(2) Value

Get the value of the set id through e.currentTarget.id, and then pass the value by setting the global object

3: Add parameter value transfer in navigator
Usage instructions

(1) Value transfer: splice ?id (parameter name) after the navigator attribute url = the value to be passed (if there are multiple parameters, use & Separate &name=value&.....)

(2) Value:

onLoad (params){


app.fetch(API.detail + params.id,(err,data) => {

})

}

2: Data request encapsulation

1. Put all interfaces in a unified js file and Export

const 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);

                                                                                       callback(e); ##

import API from "../../api/api.js";

const app = getApp();

const conf = {

data :{

title:'Loading...',

loading:true

},

onLoad (){

app.fetch(API.hot,{},(err,data) => {

})

},

3: Use template ( I found that templates are such a good thing!)

1: Define template: name Set the name of the template

Define template

2: Use template
First introduce the template

Then use template is and then write the name of the template.. through data The transmission needs to be data

Four: Array’s easier-to-use attributes and methods

Array.isArray() method is used to determine whether a value is an Array. If so, return true, otherwise return 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 pairs the array The provided function (callback function) is executed once for each element.


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 one The last element in the 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 How to add an element

dic[“key”] = “value”;

3 How to delete a 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 cannot be added You can add quotes. If the key name is a numerical value, it will be automatically converted into 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), it is not a number. You must add quotation marks, otherwise an error will be reported


6 Read attribute

obj.name || obj['name']

Note: Numeric key name The dot operator cannot be used (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 a certain attribute, if so it returns true, otherwise it returns false

if ('x' in obj) {return 1}


9 for … in loop
Used to traverse all properties of an object

for (var i in obj) {
console.log(obj);
}


10 with statement
Function: Provide some writing convenience when operating multiple properties of the same object

with(obj) {
name1 = 1;
name2 = 2;
}

is equivalent to

obj.name1 = 1;
obj .name2 = 2;

The above is the detailed content of Summary of WeChat Mini Program Development Experience. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template