Heim >WeChat-Applet >Mini-Programmentwicklung >Über Miniprogramme
1. Einige Vorgänge, die das Abrufen von Variablen in Daten erfordern. Wir können ES6-Objektdestrukturierung und -Zuweisung verwenden, um es zu vereinfachen. Wir können diese Methode nicht nur in kleinen Programmen, sondern auch in Vue verwenden.
// 例子(小程序) let a = this.data.a; let b = this.data.b; // ES6对象解构赋值 let {a,b} = this ; // vue let {a,b} = this.data; //小程序
2. Das öffentliche Attribut der Komponente des Applets ist ausgeblendet. Wenn Sie nicht auf das Dokument achten, kann es sein, dass Sie dieses öffentliche Attribut übersehen. Entspricht display:none; in CSS und kann auf Knoten angewendet werden, die häufig wechseln.
<view></view> <!-- false 为显示 true为隐藏 -->
zitierte den Beamten: „Im Allgemeinen hat wx:if höhere Wechselkosten und versteckt höhere anfängliche Rendering-Kosten. Wenn daher häufiges Wechseln erforderlich ist, ist es besser, versteckt zu verwenden.“ Wenn es unwahrscheinlich ist, dass sich die Bedingungen während der Laufzeit ändern, ist wx:if besser. Fallstricke beim Dokumentieren
<!-- 这样的写法会出现换行的效果 --> <text> SevenDream SevenDream </text> <!-- 如果不需要换行的效果--> <text>SevenDream SevenDream</text>Über Bild Wenn Sie Bilder rendern müssen, werden Sie in der Mitte einen weißen Saum finden von aufeinanderfolgenden Bildern. Wenn es im Einkaufszentrum in die Produktdetails geschnitten wird, wird es unansehnlich sein, weiße Streifen in der Mitte zu haben. Fügen Sie einfach display:bolck zum Bild-Tag hinzu.
<image></image>
5. Über den Sprung
Wenn die maximale Seitenstapelverarbeitungsmethode überschritten wird (mehr als 10 Seiten), erfolgt der Sprung wird gekapselt.//utils.js export function navigateTo(url) { let Type = getCurrentPages().length >= 10 ? 'redirectTo' : 'navigateTo' return new Promise((resolve, reject) => { wx[Type]({ url, success: res => { resolve() }, fail: err => { reject(err) }, }) }) } // 其他页面js import {navigateTo} from '../../utils/utils'; navigateTo('pages/index/index')
wx.switchTab({ url: '/pages/my/my', success:function(){ var page = getCurrentPages().pop(); //当前页面 page.onLoad(); // 调用 onload }})
var pages = getCurrentPages(); // 获取页面栈 var prevPage = pages[pages.length - 2]; //上一页 prevPage.setData(data); wx.navigateBack({ delta: 1 })
Wenn wir ein Formular haben, das an viele BIND-Eingaben gebunden werden muss, verwenden Sie die obige Lösung und fügen Sie data-* hinzu. Es ist nicht nötig, viele Methoden zu schreiben, nur eine reicht aus//data data: { obj: { a: 1 }, array: ['1'] }, //改变对象 setOBJ:function(){ var name = 'a' var obj = 'obj.a' this.setData({ [obj]:2 }) }, //改变数组 setArr: function () { var num = 0 var arr = `array[${num}]` this.setData({ [arr]: 2 }) }
<input> <input> <input>
// 写入 data:{ FromOBJ:{ name:'', phone:'', address:'' } }, onInput: function (e) { let name = e.currentTarget.dataset.name let value = e.detail.value let valueObj = `FromOBJ.${name}`; this.setData({ [valueObj]:value }) }
Beim Erstellen von Animationseffekten wird empfohlen, die offizielle Animations-API oder CSS3-Animation mit Vorsicht zu verwenden
Abschließend lassen Sie mich Sprechen Sie über eine Falle, auf die das Poster stößt (Vielleicht ist meine Art, damit umzugehen). Verwenden Sie nicht den Animationsübergangseffekt der Höhen- oder Breitenänderung auf der Ebene der WeChat-Animations-API und der CSS3-Übergang. Animationsattribute bleiben hängen und bleiben in ppt hängen. Versuchen Sie, das Problem mit deren „Transformation“ (WeChat API, CSS3) zu lösen.
Empfohlenes Tutorial: „
WeChat Mini-ProgrammDas obige ist der detaillierte Inhalt vonÜber Miniprogramme. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!