Maison > Applet WeChat > Développement WeChat > le corps du texte

Exemple d'accès aux données du programme WeChat Mini Explication détaillée

高洛峰
Libérer: 2016-12-29 09:36:19
original
2230 Les gens l'ont consulté

Permettez-moi de parler brièvement de la structure du mini programme

微信小程序 数据访问实例详解

Comme le montre la figure

Chaque vue (.wxml) n'a besoin que de 1. pour ajouter le script (.js) et le style (.wxss) correspondants du nom suffisent. Aucune référence n'est nécessaire. Les scripts et les styles sous la page sont hérités de l'app.js le plus externe, app.wxcss

<.>2. Script Autrement dit, le fichier .js a un format fixe : page, qui est utilisé pour obtenir des données

3. utils est utilisé pour placer des interfaces de données

Accès aux données, si tu connais ajax, tu peux Ce n'est pas un problème, il n'y a rien à dire

Applet WeChat, parce que l'IDE est tellement mauvais, si le code est écrit pour être difficile à lire, l'ensemble du projet sera difficile à lire maintenir.

Parce que je n'ai jamais écrit d'application, je ne sais pas comment l'accès aux données est encapsulé dans l'application

En tant que petit codeur de programme avec 3 jours d'expérience professionnelle, je pense que si. les données sur chaque page ne sont pas de la POO pour accéder à l'interface de données par vous-même

Ensuite, j'ai pensé à Linq to SQL et n'ai pris que deux des méthodes que j'avais initialement prévu d'utiliser singleordefault et firstordefault, mais c'était le cas. difficile d'y penser, j'ai donc utilisé Use getbyparams et getbyid pour trouver toutes les données en fonction des conditions, ou obtenir une donnée basée sur l'ID

Regardons simplement la méthode, c'est un peu verbeux

const API_URL = &#39;http://localhost:4424/api/&#39;
 
function getApi(url,params){
 return new Promise((res,rej)=>{
  wx.request({
   url:API_URL+&#39;/&#39;+url,
   data:Object.assign({},params),
   header:{&#39;Content-Type&#39;: &#39;application/json&#39;},
   success:res,
   fail:rej
  })
 })
}
 
module.exports = {
 GetByParams(url,page=1,pageSize=20,search = &#39;&#39;){
  const params = { start: (page - 1) * pageSize, pageSize: pageSize }
  return getApi(url, search ? Object.assign(params, { q: search }) : params)
   .then(res => res.data)
 },
 GetById(url,id){
  return getApi(url, id)
   .then(res => res.data)
 }
}
Copier après la connexion
module.exports = {} est une manière fixe d'écrire, d'écrire les méthodes une par une et de séparer chaque méthode par,.


J'ai défini un paramètre d'url, car il est impossible de mettre toutes les interfaces dans un contrôleur, donc le format de l'url est "contrôleur/action"

Regardez un appel Chestnut , vous comprendrez comment l'utiliser

const req = require(&#39;../../utils/util.js&#39;)
 
Page({
 data: {
  imgUrls: [],
  indicatorDots: true,
  autoplay: true,
  interval: 2000,
  duration: 2000
 },
 onLoad(){
  req.GetByParams(&#39;home/homebanner&#39;)//看这里  看这里  看这里
  .then(d=>this.setData({imgUrls:d,loading:false}))
  .catch(e=>{
   this.setData({imgUrls:[],loading:false})
  })
 }
})
Copier après la connexion
C'est la méthode d'indexation pour obtenir l'image de la bannière, req.GetByParams('home/homebanner'), vous pouvez aussi avoir des paramètres ici, ou vous pouvez laisser les vides

Dans la case rouge à droite, nous pouvons voir les données renvoyées par la requête, et nous pouvons également modifier les données à droite. L'interface changera en conséquence. j'en discuterai plus tard

Merci d'avoir lu, j'espère que cela pourra vous aider, merci pour votre soutien à ce site !

Pour des explications plus détaillées sur les exemples d'accès aux données des applets WeChat et les articles connexes, veuillez prêter attention au site Web PHP chinois !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal