WeChat applet configuration

Configure request api

• Package
  Create a new require.js under 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
  }

• use

// 引入
let {
    
     request } = require("../../utils/reuqire");
// 请求
request("http://elm.cangdu.org/v1/cities?type=hot").then((res) => {
    
    
      console.log(res)
});

Passing values ​​between components

Define globalData
in app.js

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

Use
app and getApp() in the page have the same effect

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

Introduce vant

WeChat applet, ---------- introduce vant component

1. Install the vant component library

npm i @vant/weapp -S --production

If there is no package.json in the project, manually download npm init -y

2. Modify app.js
   in the project to remove "style": "v2" in app.json

3. You need to manually add the following configuration in project.config.json

"packNpmManually": true,
"packNpmRelationList": [
  {
    
    
    "packageJsonPath": "./package.json",
    "miniprogramNpmDistDir": "./miniprogram/"
  }
]

4. Click on the applet-details--local settings-check the use of npm module

5. Click on the small program tool-----build npm

6. You need to configure the path corresponding to the Button in app.json or index.json.

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