1. ctrl + shift + F (搜索)
2. alt + shift + F (代码格式化---VSCode)复制代码

 e.detail.value复制代码

 this.data.属性名复制代码

 this.setData({
        num: this.data.num + operation
});复制代码

 +
 
 bandletap(e) {
    // console.log(e);
    const operation = e.currentTarget.dataset.operation;
    this.setData({
        num: this.data.num + operation
    });
  },复制代码

view,text,rich-text,button,image,icon,swiper,radio,checkbox等。复制代码

App({    // 1 应用 第一次启用的时候触发
    onLaunch() {        // 在应用第一次启动的时候 获取用户信息
    }    
    // 2 应用 被用户看到的时候触发
    onShow() {        // 常用于小程序界面之间的切换
        // 对应用的数据或者页面的效果进行重置
    }    // 3 应用 被隐藏的时候触发
    onHide() {        // 暂停或者清楚定时器
    }    // 4 应用 代码发生报错的时候  执行
    onError() {        // 在应用发生代码报错的时候，收集用户的错误信息，通过异步请求，将错误信息发送到后台去
    }    // 5 页面找不到的时候就会触发
    // 应用第一次启动的时候，如果找不到第一个入口页面，才会触发
    onPageNotFound() {        // 如果页面不存在了  通过js的方式来重新跳转页面  重新跳转到第二个首页
        // 不能跳转到tabbar页面  导航组件类似
        wx.navigateTo({            url: "/pages/demo02/index"
        })
    }
})复制代码

Page({    data: {
        
    },    onLoad: function(options) {        // onload发送异步请求来初始化页面数据
    },    onShow: function() {        // 页面显示加载
    },    onReady: function() {        // 页面初次渲染完成
    },    onHide: function() {        // 页面隐藏时加载  一个页面跳转到另外一个页面也会触发onHide事件
    },    onUnload: function() {        // 页面卸载  也可以通过超链接   关闭当前页面就会触发onUnload事件
        // demo01
        
        // 关闭当前页面就代表着卸载页面
    },    onPullDownRefresh: function() {        // 监听用户下拉事件  "enablePullDownRefresh":true
        //  页面效果的重新加载
    },    onReachBotton: function() {        // 监听用户上拉触底事件   【需要让页面出现上下的滚动才行】
        // 常用于  上拉加载下一页操作
    },    onShareAppMessage: function() {        // 用户点击右上角转发
    },    onPageScroll: function() {        // 页面滚动就触发
    },    onResize: function() {        // 页面尺寸发生变化的时候触发   
        // 常指 手机横屏竖屏的时候  触发    
        //  app.json中添加   "pageOrientation":"auto"
    },    onTabItemTap: function() {        // 1. 当前页面必须为tabbar页面
        // 2. 点击的是自己的tab  item的时候才触发
    }
})复制代码

{{ item.name }}
    // 占位符  传递的参数会替换掉 
    复制代码

methods: {
    hanldeItemTap(e) {        // 获取索引
        const {index} = e.currentTarget.dataset;        // let {tabs} = this.data;
        // tabs.forEach((v,i) => i===index?v.isActive=true:v.isActive=false);
        // 修改data中的数据
        // this.setData({
        //    tabs
        // })
        
        // 触发父组件中的自定义事件同时传递给父组件
        this.triggerEvent("itemChange", {
            index
        })
    }
}复制代码

    1
    2
    3复制代码

data: {    tabs: [
        {            id: 1,            name: "首页",            isActive: true
        },
        {            id: 2,            name: "待发货",            isActive: false
        },
        {            id: 3,            name: "待付款",            isActive: false
        }
    ]
}// 自定义事件   接收子组件传递的数据的handleItemChange(e) {    // 接收传递过来的参数
    const {index} = e.detail;    // 拿到原数组
    let {tabs} = this.data;
    tabs.forEach((v,i) => i===index?v.isActive=true:v.isActive=false);    // 修改data中的数据
    this.setData({
        tabs
    })
}复制代码

tbaBar: {    "color": "",    //未选中的字体的颜色
    "selectedColor": "",    //选中后的字体的颜色
    "backgroundColor": "",  // 背景色
    "position": "", //定位
    "borderStyle": "",   //边框样式 
    "list": [
        {            "pagePath": "",   // 页面的路径
            "text": "",   // 标题的名称
            "iconPath": "",   // 未选中的图标路径
            "selectedIconPath": ""   // 选中后的图标的路径
        }
    ]
}复制代码

page,view,text,swiper,swiper-item,image,navigator {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}


/*
    主题颜色
    1. less 中是存在  变量  的
    2. 原生的css和wxss 也是支持 css的
*/
page {
    --themeColor: #eb4500;
    // 设计稿大小为 375px 时,1px = 2rpx,14px = 28rpx
    font-size: 28rpx;
}复制代码

view {
    color: var(--themeColor);
}复制代码

"window": {    "backgroundTextStyle": "light",   // 字体颜色
    "navigatorBarBackgroundColor": "#2b4500",  // 背景色
    "navigatorBarText": "唯品会",  // 字体提示
    "navigatorBarTextStyle": "white",  // 字体样式    }复制代码

Page({    data: {        swiperList: []
    },    // 页面加载事件
    onLoad: function() {        /*
            1. 发送异步请求 获取使用的数据
        */
        wx.request({            url: '',  // 接口地址
            success: (result) => {                // 请求成功 给swiperList数组赋值
                this.setData({                    swiperList: result.data.message
                })
            }
            
        });        /*
            wx.request异步请求太多了就会产生   回调地狱   的问题
            
            解决方法:  es6中的promise
        */
    }
})复制代码

// 同时发送异步代码的次数let ajaxTime=0;export const request=(params) => {
    ajaxTime++;    // 数据加载效果
    wx.showLoding({       title: "加载中",        mask: true
    });    return new Promise((resolve, reject) => {
        wx.request({            // 解构传递的参数
            ...params,            success: (result) => {
                resolve(result);
            },            faile: (err) => {
                reject(err);
            },            // 不管是成功还是失败都会调用这个函数
            complete: () => {
                ajaxTime--;                if(ajaxTime === 0) {                   // 关闭正在等待的图标
                    wx.hideLoading();
                }                
            }
        });
    });
}复制代码

//  引入封装文件 (注意: 一定要把路径补全)import { request } from '../../request/index.js';  // 这里引入的是封装的request函数Page({    data: {        swiperList: []
    },    // 页面加载事件
    onLoad: function() {        /*
            1. 发送异步请求 获取使用的数据
        */
        /*
            wx.request({
                url: '',  // 接口地址
                success: (result) => {
                    // 请求成功 给swiperList数组赋值
                    this.setData({
                        swiperList: result.data.message
                    })
                }

            });
        */
        /*
            wx.request异步请求太多了就会产生   回调地狱   的问题
            
            解决方法:  es6中的promise
        */
        
        // 调用方法
        this.getSwiperList();
        
    },    // 调用封装好的方法
    getSwiperList() {        //  这里填充的数据会替换掉request方法中的...params,
        request({ url: 'htltps://api/zbtbs/home/swiperList'}); 
        //  数据获取成功
        .then (result => {            this.setData({                swiperList: result.data.message
            })
        });
    }
})复制代码

// 接口返回的数据Cates: [],onLoad: function(options) {    // 获取本地存储中有没有旧数据
    const Cates = wx.getStorageSync("cate");    // 判断本地是否存在
    if(!Case) {        // 不存在  发送请求数据
        this.setCates();
    }else {        // 有旧的数据
        // 定义数据过期的时间
        if(Date.now() - Cates.time > 1000 * 10) {           // 重新发送请求
            this.getCates();
        } else {            this.Cates = Cates.data;            // 渲染数据
        }
    }
}// 获取请求的数据getCates() {    // 把接口的数据存储到本地存储中
    wx.setStorageSync("cates", {time：Date.now(),data: this.Cates});
}复制代码

export const request=(params) => {    // 定义公共的url
    const baseUrl = "https://api.zbsb.cn/api/public"
    return new Promise((resolve, reject) => {
        wx.request({            // 解构传递的参数
            ...params,            url: baseUrl + params.url;
            success: (result) => {
                resolve(result);
            },            faile: (err) => {
                reject(err);
            }
        });
    });
}复制代码

// 传递参数// 拿取参数
onLoad：function(options) {
    consol.log(options);  // 打印输出options的值
}复制代码

properties: {    tabs: Array,    value: []
}


    
           
            {{ item.value }}         
    
    // 切换内容    
        
    methods: {    // 点击事件
    handleItemTap(e) {        // 获取点击的索引
        const {index} = e.currentTarget.dataset;        // 触发父组件中的事件
        this.triggerEvent("tabsItemChange", {index});
    }
}复制代码

//bindtabsItemChange 监听自定义事件
    1
    2
    3// 标题的点击事件
bindtabsItemChange(e) {
  // 获取被点击的标题的索引
  const {index} = e.detail;
  // 修改原数组
  let {tabs} = this.data;
  tabs.forEach((v,i)=>i===index?v.isActive=true:v.isActive=false);
  // 赋值到data中
  this.setData({
    tabs
  });
}复制代码

// 获取商品数据列表async getGoodsList() {    const res=await request({url:"/goods/search",data:this.QueryParams});    // 获取总条数
    const total = res.total;    // 计算总页数
    this.totalPage = Math.ceil(total / this.QueryParams.pagesize);    // 拼接数组
    this.setData({        goodsList: [...this.data.goodsList,...res.goods]
    });    // 关闭下拉刷新的窗口
    wx-stopDownRefresh();
}// 滚动条触底事件onReachBottom() {    // 判断还有没有下一页数据
    if(this.QueryParams.pagenum >= this.totalPage) {        // 当前页码 > 总页数    没有下一页
        
    }    else {        // 还有下一页  当前页码++ 重新发送请求  数据请求回来后要对data中的数组进行拼接
        this.QueryParams.pagenum++；        this.getGoodsList();
    }
}复制代码

onPullDownRefresh() {    // 重置  数据  数组
    this.setData({        goodsList: []
    });    // 重置页码   设置为1
     this.QueryParams.pagenum=1;    // 重新发送请求
    this.getGoodsList();
}复制代码

wx.showModel({    title: '提示',    content: '您是否要删除？',    success :(res) => {
        ...
    }
})复制代码

cart.splice(index, 1);  // 删除索引为index的元素cart.filter(v => v.checked);  // 挑选出cart数组中checked为true的值复制代码

export const showModel=({content}) => {    return new Promise((resolve,reject) => {
        wx.showModel({            title: '提示',            content: content,            success :(res) > {
                resolve(res);
            },            fail :(err) => {
                reject(err);
            }
        })
    })
}复制代码

import {showModel} from '../../utils/asyncWx.js';async showTips() {    const res=await showModel({content: '您是否要删除？'})    if(res.confirm) {
       cart.splice(index, 1);        this.setData(cart);
    }
}复制代码

wx.getStorageSync("address");复制代码

handleOrderPay() {   try {        // 1. 判断缓存中有没有token值
        const token = wx.getStorageSync("token");        // 2. 判断
        if(!token) {            // 跳转到  授权 页面
            wx.navigateTo({                url: "/page/auth/index"
            })            return;
        }        // 3. 创建订单
        // 准备创建订单需要的参数
        const header = {Authorization:token};        // 准备请求体参数
        const order_price = this.data.totalPrice;   // 订单总价格
        const consignee = this.data.address.all;  // 详细地址
        let goods = [];        const cart = this.data.cart;
        goods.forEach(v => goods.push({            goods_Id: v.goods_Id, // 商品的id
            goods_number: v.goods_number, //商品数量
            goods_price: v.goods_price  // 商品的单价
        }))        const orderParams = {order_price,consignee,goods}        // 4. 准备发送请求  创建订单  获取订单编号
        const {order_number}=await request({url:                     "/order/create"},method:"POST",data:orderParams,head:head});        // 5. 发起 预支付接口
        const {pay}=await request({url:"/order/req_unifiedorder",method:"POST",head,data:{order_number}});        // 6. 发起微信支付
        await requestPayment(pay);        // 7. 查询后台  订单状态是否成功
        const res=await request(url:"/orders/chkOrder",method:"POST",head,data:{order_number}});        // 提示支付成功
        await showToast({title:"支付成功"});        // 手动删除 缓存中支付成功购物车的数据
        let newCart = wx.getStorageSync("cart");        // 过滤出没有被选中的数据
        newCart = newCart.filter(v => !v.checked);
        wx.setStorageSync("cart",newCart);        // 8.支付成功  跳转到订单页面
        wx.navigateTo({            url: '/page/order/index'
        })
   } catch(err) {       await showToast({title:"支付失败"});
   }
    
}复制代码

    获取授权复制代码

// 获取用户信息// encryptedData  // rawData// iv// signatureasync handleGetUserInfo(e) {    try {        // 获取用户信息
        const { encryptedData,rawData,iv,signature } = e.detail;        // 获取小程序登录之后的token值  在asyncWX.js中封装token请求方法
        // wx.login({
        //     timeout: 1000,
        //    success: (result) => {
        //      cost { code } = result;   
        //    }
        // })
        const {code} = await login();        const loginParams = { encryptedData, rawData, iv, signature, code }        // 发送请求  获取用户的token
        const {token}=await request(url: '/user/wxlogin',data: loginParams,methods:         "post");        // 将获取到的token存储到缓存中，同时跳转回上一个界面
        wx.getStroageSync("token", token);
        wx.navigateBack({            data: 1 // 返回上一层
        })    
    } catch(err) {        console.log(err);
    }
}复制代码

export const requestPayment=(pay) => {    return new Promise((resolve,reject){
        wx.request({
           ...pay,           success: (result) => {
                resolve(result);
           },           fail: (err) => {
               reject(err);
           }
        })                   
    })
}复制代码

wx.uploadFile({    url: '', // 图片要上传到哪里
    filePath: '', // 被上传文件的路径
    name: '',  // 上传的文件的名称  后台通过定义的上传的名称来获取名称
    formData: {}, // 顺带的文本信息})复制代码