Configuración del applet de WeChat

Configurar la API de solicitud

  • Paquete
    Cree un nuevo require.js en utils
// 默认请求方法为GET 默认data为空
function sendRequire(url,method="GET",data={
    
    }){
    
    
  // 开启loading
  wx.showLoading({
    
    
    title: '加载中',
  })
  // 新建promise对象并返回
    return new Promise((resolve,reject) => {
    
    
    //  创建  请求
    wx.request({
    
    
      url, 
      method,
      data,
      success:(res)=> {
    
    
        // 成功回调
        // console.log(res);
        resolve(res)
      },
      fail(err){
    
    
      	// 失败
        reject(err)
      },
      // 无论请求成功或失败都会执行此函数
      complete(){
    
    
      	// 隐藏loading 
        wx.hideLoading();
      }      
    })
    })
  }
	// 导出 
  module.exports =  {
    
    
    request:sendRequire
  }
  • usar
// 引入
let {
    
     request } = require("../../utils/reuqire");
// 请求
request("http://elm.cangdu.org/v1/cities?type=hot").then((res) => {
    
    
      console.log(res)
});

Pasar valores entre componentes

Definir globalData
en app.js

App({
    
    
  ...
  globalData: {
    
    
    weather:"雪"
  }
})

Usar
app y getApp () en la página tiene el mismo efecto

  // 使用globalData
 const app = getApp();
 	console.log(app.globalData); // 雪
	// 修改
    app.globalData.weather = "雨"
    	
    console.log(getApp().globalData); // 雨

Introducir vant

Applet de WeChat, ---------- introduce el componente vant

  1. Instalar la biblioteca de componentes de vant
npm i @vant/weapp -S --production

Si no hay package.json en el proyecto, descargue manualmente npm init -y

  1. Modifique app.js
    en el proyecto para eliminar "style": "v2" en app.json

  2. Debe agregar manualmente la siguiente configuración en project.config.json

"packNpmManually": true,
"packNpmRelationList": [
  {
    
    
    "packageJsonPath": "./package.json",
    "miniprogramNpmDistDir": "./miniprogram/"
  }
]
  1. Haga clic en el subprograma-detalles - configuración local-compruebe el uso del módulo npm

  2. Haga clic en la herramienta de subprograma ----- build npm

  3. Debe configurar la ruta correspondiente al botón en app.json o index.json.

// 在app.json中引入
"usingComponents": {
    
    
  "van-button": "@vant/weapp/button/index"
}

Supongo que te gusta

Origin blog.csdn.net/t5_5_5_5_5_7_7/article/details/109901540
Recomendado
Clasificación