Cet article présente principalement des informations pertinentes sur l'explication détaillée des exemples d'accès aux données des mini-programmes WeChat. Les amis qui en ont besoin peuvent s'y référer
Tout d'abord, parlons brièvement de la structure du mini-programme
Comme le montre l'image1 Chaque vue (.wxml) n'a besoin que d'ajouter le script (.js) et le style (.wxss) avec le nom correspondant. Aucune référence n'est nécessaire. Les scripts et les styles sous la page sont hérités du app.js le plus externe, app.wxcss2. Le script est un fichier .js. Il a un format fixe : page. , qui sert à obtenir des données3. Les utilitaires sont utilisés pour placer des interfaces de donnéesL'accès aux données, si vous connaissez ajax, ce n'est pas un problème, il n'y a rien à direApplet WeChat, parce que l'IDE l'est aussi. C'est nul Si le code est écrit pour être difficile à lire, l'ensemble du projet sera difficile à 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 = 'http://localhost:4424/api/' function getApi(url,params){ return new Promise((res,rej)=>{ wx.request({ url:API_URL+'/'+url, data:Object.assign({},params), header:{'Content-Type': 'application/json'}, success:res, fail:rej }) }) } module.exports = { GetByParams(url,page=1,pageSize=20,search = ''){ 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) } }
module.exports = {} C'est une méthode d'écriture fixe, dans laquelle les méthodes sont écrites une par une, et chaque méthode est séparée par,.
const req = require('../../utils/util.js') Page({ data: { imgUrls: [], indicatorDots: true, autoplay: true, interval: 2000, duration: 2000 }, onLoad(){ req.GetByParams('home/homebanner')//看这里 看这里 看这里 .then(d=>this.setData({imgUrls:d,loading:false})) .catch(e=>{ this.setData({imgUrls:[],loading:false}) }) } })
image de bannière, req.GetByParams('home/homebanner'), cela peut aussi être utilisé ici Avec les paramètres, vous pouvez aussi les laisser vides
La page finale est comme ça Dans l'encadré rouge à droite, on peut voir les données renvoyées par la requête, Vous pouvez également modifier les données à droite, et l'interface changera en conséquence. Il s'agit dedébogage, et nous en discuterons plus tard
[Recommandations associées. ]1.Téléchargez le code source complet du programme WeChat Mini
2Démo du programme WeChat Mini : Lezhu.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!