How to hide controls in WeChat Mini Programs's Development document
This article mainly introduces the WeChat Mini Programs development document how to hide the control of the relevant knowledge, the content is detailed and easy to understand, the operation is simple and fast, has a certain reference value, I believe that everyone after reading this WeChat Mini Programs development document how to hide the control article will have a harvest, let's take a look.
The implementation of Hidden controls developed by WeChat Mini Programs
Background:
In the development process of Mini Program, you often need to hide a control. Because the project was originally required to switch between the two canvas, but Mini Program's canvas support is really little, jquery mobile or canvas into a picture can easily achieve the sliding effect, but do not support, and finally can only do a canvas, show when needed, do not need to hide.
Implementation method:
Logs.wxml
[javascript] view plain copy
{{showView?\ 'Click To CheckIdleReason\':\ 'Click To Check MTStatus\'}}
Logs.js
[javascript] view plain copy
Page ({
Data: {
ShowView: true
}
OnLoad: function (options) {
/ / Lifecycle function-- listen for page loading
ShowView: (options.showView = = true? True: false)
}
, onChangeShowState: function () {
Var that = this
That.setData ({
ShowView: (that.data.showView)
})
}
})
Logs.wxss
[javascript] view plain copy
.bright789 _ view_hide {
Display: none
}
.bright789 _ view_show {
Display: block
}
The logic is clear from the files on the above three pages: logs.wxml 's onChangeShowState button triggers an event in logs.js that changes the value of showView, while in logs.wxml it determines the class property of the canvas canvas based on the value of showView, and sets which of the two class properties is displayed in logs.wxss.
This is the end of the article on "how to hide controls in WeChat Mini Programs Development document". Thank you for reading! I believe that everyone has a certain understanding of the knowledge of "how to hide controls in WeChat Mini Programs development documents". If you want to learn more, you are welcome to follow the industry information channel.
