WeChat mini-program parameter transfer details, mini-program transfer details

Source: Internet
Author: User

Detailed explanation of parameter transfer of Applet, detailed explanation of parameter transfer of Applet

The launch of applets will undoubtedly trigger another wave in the mobile Internet industry.

Some people will question whether a small program will get angry or not. I don't know if it will get angry. The number of users can understand everything.

Applet-parameter transfer

Here I have found two parameter transfer methods for small programs. For convenience, I will share them with you separately.

1. Passing parameters through events

First, let's look at the definition of the event by the Applet:

# What is an event?

The list text event is the communication method between the view layer and the logic layer.
Here, the list text event can be used to send user behavior feedback to the logic layer for processing.
The list text event can be bound to the component. When the event is triggered, the corresponding event processing function in the logic layer is executed.
The list text event object can carry additional information, such as id, dataset, and touches.

It is clearly pointed out that it is the communication method from the view layer [wxml] to the logic layer [js]. The time object can carry additional information. It is certainly correct to use this event to transmit parameters, next, let's take a look at the example:

View. wxml

<View id = "tapTest" data-hi = "MINA" bindtap = "tapName"> Click me! </View>

Logic. js

Page({ tapName: function(event) {      console.log(event.target) }})

Log Printing

We can see that the data-hi = "MINA" value is set in dataset. Now let's take a look at what we just wrote. First, bindtap, starting with bind, is to bind an event to him, the name of this event is the value after "=" and the name of the Bound event. It must be defined at the logic [js] layer. Then, we passed the value. We can see that we have written data-hi here, which is the same definition method as we usually write JavaScript values. This data-* Corresponds to the dataset value in the attribute target of the event. Here we need to call event.tar get. dataset. hi to get the value corresponding to data-hi.

Note the definition name of data: the writing method starts with data. Multiple words are separated from a hyphen (-) and cannot contain uppercase letters (uppercase letters are automatically converted to lowercase letters) for example, data-element-type is finally obtained in event.tar get. dataset converts a hyphen to camper elementType.

Official example:

<View data-alpha-beta = "1" data-alphaBeta = "2" bindtap = "bindViewTap"> DataSet Test </view> Page ({bindViewTap: function (event) {event.tar get. dataset. alphaBeta = 1 //-it will be converted into the camper method event.tar get. dataset. alphabeta = 2 // converts uppercase letters to lowercase letters }})

Ii. parameter passing through the navigator jump url

*. Wxml

<View class = "btn-area"> <navigator url = "navigate? Title = navigate "hover-class =" navigator-hover "> jump to a new page </navigator> <navigator url =" redirect? Title = redirect "redirect hover-class =" other-navigator-hover "> open on the current page </navigator> </view>

* After. js jumps to the new page, it directly receives parameters in onload. The receiving method is options. [parameter value].

Page({ onLoad: function(options) {  this.setData({   title: options.title  }) }})

Well, I will write it here today. By the way, I will write the link to the document, which is included in the above documents. I just moved them out. I told them again in my words. ... (⊙ _ ⊙ ;)...

Thank you for reading this article. I hope it will help you. Thank you for your support for this site!

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.