Was ist bei der Nutzung von Miniprogrammen zu beachten?

In diesem Artikel erfahren Sie hauptsächlich, auf welche Punkte Sie bei Miniprogrammen achten müssen, um Ihnen dabei zu helfen, die WeChat-Funktionen besser zu entwickeln.

1. Details

1.Ein kleines Programm beinhaltet eine App, die das Gesamtprogramm beschreibt und mehrere Seiten, die die jeweiligen Seiten beschreiben

2. Das Applet-Framework ist in eine Ansichtsschicht und eine Logikschicht unterteilt

Die Logikschicht ist in JavaScript geschrieben.

Die Ansichtsebene wird von WXML und WXSS geschrieben und durch Komponenten angezeigt. Komponente ist die Grundkomponente der Ansicht.

Spiegeln Sie die Daten in der logischen Ebene in einer Ansicht wider. und gleichzeitig werden Ereignisse von der Ansichtsschicht an die Logikschicht gesendet.

2. Kleine Wissenspunkte

1.App() Funktion wird verwendet, um ein kleines Programm zu registrieren. Akzeptiere eins Objektparameter, der die Lebenszyklusfunktion des Applets usw. angibt.

befinden sich alle in der app.js-Datei

Mit der Funktion 2.Page() wird eine Seite registriert. einen Gegenstand annehmen Parameter, die die Anfangsdaten der Seite, Lebenszyklusfunktionen, Ereignisbehandlungsfunktionen usw. angeben.

(1).Initialisierungsdaten: Daten

Daten werden in Form von JSON von der Logikschicht an die Rendering-Schicht übertragen, daher müssen die Daten in JSON konvertiert werden Format: Zeichenfolge, Zahl, Boolescher Wert, Objekt, Array.

a8899951655249ad0ef4f91602aa4354

(2). Lebenszyklusfunktion

(3). Ereignisbehandlungsfunktion: bindtap

1075a5d2afd5223d26c7e913f8374360 click me >

3.
Dynamisches Ein- und Ausblenden eines Steuerelements

51184bddf12d7f17d51841733bd1d942Liste 1de5f4c1163741e920c998275338d29b2

data:{  
    open:false  
  },  
  showitem:function(){  
      this.setData({  
          open:!this.data.open  
      })  
  }

.display_show{  
    display: block;  
}  
.display_none{  
    display: none;  
}

4.Bestanden data-* und e.target.dateset übergeben Parameter

395ecad7b9a54a4e40588985e229fb68{{firstPerson}}de5f4c1163741e920c998275338d29b2

f45adeddc3992d96bc208dd6f99187c5EATde5f4c1163741e920c998275338d29b2

this.setData({  
             firstPerson:e.target.dataset.me,  
       })

Zu diesem Zeitpunkt: firstPerson=eat

5. Flexbox-Wort: display:flex;

<view class="phone_one" bindtap="clickPerson">  
    <view class="phone_personal">{{firstPerson}}</view>  
    <image src="../../image/i.png" class="personal_image {{selectArea ? &#39;rotateRight&#39; :&#39;&#39;}}"></image>  
</view>

Im übergeordneten Element: display:flex;

justify-content:space-between;

Dies Art und Weise, wie die Teilmengen nebeneinander angeordnet werden. justify-content:space-between; Auf diese Weise befinden sich die Teilmengen an beiden Enden

6. Holen Sie sich Ihren eigenen Stil e.detail.width, e.detail.height

c89ae9cf7ee98599514ae4f90566f40ff8e950ebc6c1ea27f76cf997b9216fe6

var app = getApp()
Page({
	data: {
		imgwidth:0,  
        imgheight:0,
        
	},
	imageLoad: function(e) {  
        var _this=this;  
        var $width=e.detail.width,    //获取图片真实宽度  
            $height=e.detail.height,  
            ratio=$width/$height;   //图片的真实宽高比例  
        var viewWidth=this.data.screenWidth,           //设置图片显示宽度，  
            viewHeight=parseInt(viewWidth/ratio);    //计算的高度值
        _this.setData({  
            imgwidth:viewWidth,  
            imgheight:viewHeight  
        })
    }

7.如何定义全局数据

在app.js的App({})中定义的数据或函数都是全局的，在页面中可以通过var app = getApp();  app.function/key的方式调用（不过我们没有必要再app.js中定义全局函数）

（1）设置全局变量

App({

     globalData:{    
          userInfo:null,    
          test:"test"    
      }   

})

获取变量值

var test = getApp().globalData.test;    
console.log(test)   

三.注意点小程序误区

1.小程序不是Html5。小程序是微信全新定义的规范，是基于xml+js的，不支持也不兼容HTML，兼容受限的部分css写法。

小程序和腾讯X5引擎也没关系。X5是QQ浏览器团队的，是基于HTML的，但小程序是微信团队自研的

2.小程序不是b/s。微信宣传的一个重点，是触手可得，不用安装。但小程序并不是b/s的在线页面，它是c/s架构的。

3.小程序体验好并且小程序并非只适合低频或长尾应用

4. Miniprogramme sind keine App Stores, sondern OS (Betriebssysteme)

Verwandte Empfehlungen:

Beispiel für die globale Konfigurationsentwicklung eines WeChat-Applets

Entwicklung der Tab-Funktion für das WeChat-Miniprogramm

Entwicklung des WeChat-Miniprogramms um Bilder hochzuladen Beispielfreigabe

Das obige ist der detaillierte Inhalt vonWas ist bei der Nutzung von Miniprogrammen zu beachten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!