Shulou(Shulou.com)05/31 Report--

This article mainly introduces WeChat Mini Programs how to achieve custom Toast pop-up frame related knowledge, the content is detailed and easy to understand, simple and fast operation, has a certain reference value, I believe that everyone after reading this WeChat Mini Programs how to achieve custom Toast pop-up box article will have a harvest, let's take a look at it.

Let's first take a look at the effect picture:

How to use it, let's take a look:

The WeTaost plug-in source code is located in the src directory and contains 3 files.

Wetoast.js: script code

Wetoast.wxml: template structure

Wetoast.wxss: Styl

You only need to add the above three files when you use them.

Step 1: introduce wetoast.js into the app.js of the project and register on Mini Program. All Page pages of Mini Program are available.

/ / app.jslet {WeToast} = require ('src/wetoast.js') / / Register Mini Program and receive an Object parameter App ({WeToast})

Step 2: introduce wetoast.wxss into the app.wxss of the project

@ import "src/wetoast.wxss"

As for the inside style, the size of the pop-up box can be modified by yourself.

Step 3: introduce the WeToast template

Finally, to use it on that page, create a WeToast instance in onLoad:

/ / get the application instance let app = getApp () Page ({data: {}, / / execute only once, and can be used to obtain and set data onLoad: function () {/ / create a reusable WeToast instance and attach it to the this Visit new app.WeToast ()} through this.wetoast, onTimeToast: function () {this.wetoast.toast ({title: 'Please enter your mobile phone number, duration: 1000})}) this is the end of the article on "how WeChat Mini Programs implements a custom Toast pop-up box". Thank you for reading! I believe that everyone has a certain understanding of "WeChat Mini Programs how to achieve custom Toast pop-up box" knowledge, if you want to learn more knowledge, welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.