Summary of WeChat mini-program development experience (recommended) and summary of program development experience

Source: Internet
Author: User

Summary of mini-program development experience (recommended) and summary of program development experience

I. Parameter Value passing Method

1: data-id

We can add the data-* attribute to the HTML element to pass the required value. usage instructions:

(1) Set data-id

<view class="block" bindtap="playTap" data-id="{{modle.id}}">

(2): Value + pass value

playTap:function(e) {    const dataset = e.currentTarget.dataset;    wx.navigateTo({     url: '../play/index?id='+ dataset.id    })    console.log(dataset.id);  }

(3): Value

OnLoad: function (param) {// page initialization this. setData ({currentId: param. id })}

Data-Note: The data-name cannot contain uppercase letters. I used to find this error only after I used to write a letter in upper case .. objects cannot be stored in data-* properties.

2: Set the id method to pass the value

Usage instructions:

(1) set the id

<view bindtap=“playTap" id="{{modle.id}}">

(2) Values

Use e. currentTarget. id to obtain the value of the Set id, and then pass the value by setting the global object.

3: Add parameter values to navigator

Usage instructions

(1) Pass the value: after the property url of navigator is spliced? Id (parameter name) = value to be passed (if multiple parameters are separated by & name = value &.......)

<navigator url="../my/my?id={{item.id}}" wx:for="{{modles}}">

(2) values:

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

Ii. Data Request Encapsulation

1. Put all interfaces in a unified js file and export them

const api = {  interface1: 'https://........',   interface2: 'https://.......',   interface3: 'https://....',   .....}module.exports = api;

2: Create a method to encapsulate 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 Request data on the subpage

Import API from ".. /.. /api. js "; const app = getApp (); const conf = {data: {title: 'loading... ', loadding: true}, onLoad () {app. fetch (API. hot, {}, (err, data) => {})},

3. Use a template (discover that the template is really a good thing !)

1: Define template: name sets the Template name

<template name="homecell">   <view class="item">  </view> </template>

2: Use a template

First introduce the Template

<import src="../../commonXml/homecell.wxml" />

Use the template is and then write the name of the template .. data is required for data transmission.

<template is="homecell" data="{{item}}"></template>

4. Good attributes and methods of Array

The Array. isArray () method is used to determine whether a value is an Array. If yes, true is returned; otherwise, false is returned.

The concat () method combines the input array or non-array values with the original number to form a new array and return.

The forEach () method executes the provided function (callback function) for each element of the array once ).

The join () method concatenates all elements in the array into a string.

The keys () method returns an array index iterator.

The map () method returns a new array consisting of the returned values after each element in the original array calls a specified method.

The pop () method deletes the last element in an array and returns this element.

Add one or more elements to the end of the array in the push () method, and return the new length (length attribute value) of the array ).

ToString () returns a string that represents the specified array and its elements.

5. Common Methods for Object

1. Initialization Method

var obj = [];var obj = new obj();var obj = Object.create(null);

2. Add an element

dic[“key”] = “value”;

3. key deletion method

delete dic[“key”];

4. Clear all word entries

dic.clear();

5. Delete

delete dic;

6. view all attributes

Object.keys(obj);

All key names of the object are strings, so you can add them without quotation marks. If the key name is a value, it is automatically converted to a string. However, if the key name does not meet the Identification name conditions (for example, the first character is a number, or contains spaces or operators), or is not a number, quotation marks must be added. Otherwise, an error is reported.

7. Read attributes

obj.name || obj['name']

Note: The value key name cannot use the dot operator (because it will be treated as the decimal point), and only the square brackets operator can be used.

8. Check whether the variables are declared.

if(obj.name) || if(obj['name'])

9 The in operator is used to check whether an object contains an attribute. If an object contains an attribute, true is returned. Otherwise, false is returned.

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

10... In Loop

Used to traverse all attributes of an object

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

11 with statement

Purpose: To facilitate writing when operating on multiple attributes of the same object

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

Equivalent

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

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.