Shulou(Shulou.com)06/01 Report--

In this article, the editor introduces in detail the "WeChat Mini Programs development to set the default picture, error loading picture method", the content is detailed, the steps are clear, and the details are handled properly. I hope that this "WeChat Mini Programs development to set the default picture, error loading picture method" article can help you solve your doubts, following the editor's ideas slowly in-depth, together to learn new knowledge.

Wxml: description:

ImgList: list of image data sources. You need to define the initial data in data, or get the data dynamically from the API.

ErrorFunction: image loading error binding event. Replacing the error image with the default image is mainly operated here.

Data-errorimg: error image index data, which needs to be used in errorFunction to record the corresponding location of the error image.

If the image address is empty, binderror will not be triggered, so judge the image address directly. If it is empty, replace it with the default image.

Js:data: {imgList: ", / / Picture list, dynamically get defaultImg:".. / assets/img/defaultImg.png ", / / default Picture},. Omit the image data source replacement code. / * events triggered by picture loading error * / errorFunction: function (e) {if (e.typewriter = "error") {var errorImgIndex = e.target.dataset.errorimg / / get the subscript of the error picture loop var imgList= this.data.imgList / / bind picture list data to the variable imgList [errorImgIndex] = this.data.defaultImg / / error picture Replace with the default picture this.setData ({evaluteUserPic: evaluteUserPic})}} Note: use this method It is necessary to put the image data source in data, so that the data can be replaced in the event of binderror, and the data of the API cannot be called directly in wxml.

After reading this, the article "WeChat Mini Programs's method of setting default pictures and loading pictures incorrectly" has been introduced. If you want to master the knowledge points of this article, you still need to practice and use it before you can understand it. If you want to know more about related articles, 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.