Home > WeChat Applet > WeChat Development > Detailed explanation of business card boxes and business card holders

Detailed explanation of business card boxes and business card holders

零下一度
Release: 2017-06-10 14:16:02
Original
2831 people have browsed it

The user has multiple business cards and needs to switch left and right to view them. Switching down is the menu button. Here we need to slide in two places. We use the sliding component swiper provided by WeChat and use it in a nested manner. The first layer is the up and down sliding of the business card display and the menu button. The second layer is the left and right sliding of the business card display (supports mutual embedding. It can be used as a set, so you can use it with confidence). Vertical Adding it means sliding vertically, removing it means sliding left and right. The overall structure is as follows: The click event is bound to the data switching method because it needs to support multiple click switching. The initialization data is nextSlide: look at the nextSlide event again. currentSlide is the index of the current page. Changing it can complete the switching effect. You can see in the figure above that cs is set to 0 when initializing the data. Therefore, just assign the current data.cs+1, and then switch the bound click event clickNext to nextSlideAgain. Let’s look at the nextSlideAgain event again, which subtracts 1 index to achieve the switching effect of multiple clicks. The specific effects can be seen. Click on the personal business card to enter

1. WeChat Mini Program Development (5) Detailed explanation of the "Me" page of the business card box

Detailed explanation of business card boxes and business card holders

Introduction: The user has multiple business cards and needs to switch left and right to view them. Switching down is the menu button. Here we need to slide in two places. We use the sliding component swiper provided by WeChat and use it in a nested manner. The first layer is the up and down sliding of the business card display and the menu button. The second layer is the left and right sliding of the business card display (supports mutual embedding. It can be used as a set, so you can use it with confidence).

2. WeChat Mini Program Development (3) Business Card Holder Details Page Example Tutorial

Introduction: Added today New stuff! In addition to the development log itself, I also answered some questions from friends. Without further ado, let’s take a look at the rendering of the “Business Card Box” details page:

3. WeChat Mini Program Development (1) Detailed explanation of transforming service account into mini program Example

Detailed explanation of business card boxes and business card holders

Introduction: WeChat application account (mini program, the new name of "application account") is finally here Got it! It is still in the internal testing stage, and WeChat has only invited some companies to participate in the closed beta test. Everyone must be concerned about what the final form of the application account will look like? How to transform a "service account" into a "mini program"? Let us temporarily demonstrate the development process with an example of a simple third-party tool. (The company's project is confidential and cannot share codes and screenshots. Boka Jun secretly wrote tutorials for everyone while working overtime. Thanks to the "Business Card Box" team for providing their service number to perform this surgery, so Boka Jun's tutorial uses " name...

The above is the detailed content of Detailed explanation of business card boxes and business card holders. For more information, please follow other related articles on the PHP Chinese website!

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