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.

(2). Lebenszyklusfunktion

(3). Ereignisbehandlungsfunktion: bindtap

click me >

3.
Dynamisches Ein- und Ausblenden eines Steuerelements

Liste 1

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

< view class="phone_personal">{{firstPerson}}

EAT

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

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!