weixin_44387746-优快云博客

原创微信小程序使用wxs格式化时间戳

utils文件夹下新建 index.wxs// 时间戳转化日期格式 yy-mm-dd hh:mm:ssfunction newFormatTime(timestamp) { var date = getDate(timestamp * 1000);//时间戳为10位需*1000 var Y = date.getFullYear() + '-'; var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) :

2022-04-02 11:44:54 1444

原创 js筛选数组是否存在某个对象

let history = wx.getStorageSync('history') || [], { goods_id } = this.data.goodsInfo, arr = [],//当前浏览的商品,为空则表示当前商品是第一次浏览 curIndex = 0 // 商品在 history 中的索引 // 筛选历史记录中是否浏览过该商品 history.filter(function...

2022-03-29 17:03:41 870

原创修改微信小程序 CheckBox 样式

/* 重写 checkbox 样式 *//* 未选中的背景样式 */checkbox .wx-checkbox-input { border-radius: 50%; /* 圆角 */ width: 46rpx; /* 背景的宽 */ height: 46rpx; /* 背景的高 */}/* 选中后的背景样式（红色背景无边框可根据UI需求自己修改） */checkbox .wx-checkbox-input.wx-checkbox-inp

2022-03-25 17:04:55 941

原创微信小程序scroll左右联动

const { get } = require("../../utils/request")//存放右侧分类的高度累加数组var heightList = [];//记录scroll-view滚动过程中距离顶部的高度var distanceToTop = 0;Page({ /** * 页面的初始数据 */ data: { scrollList: [],//分类数据 windowHeight: '',//可视区域高度

2022-03-24 14:18:07 355

原创根据时间分类数据

2022-03-18 16:27:52 284

原创 js实现手机号脱敏

let phone = '12345678901'return phone.substring(0, 3) + '****' + phone.substring(phone.length - 4, phone.length)

2022-03-15 11:13:12 646

原创 uniapp实现三级联动

<template> <picker-view indicator-style="height: 50px;" class="picker-view" @change="change"> <picker-view-column> <view class="item" v-for="(item,index) in provinceData" :key="index"> {{item.label}} </view> &lt

2022-03-11 15:21:31 1503

原创手把手教你使用 vuex

第一步，了解Vuex🤯 想象一个场景如果你的项目里有很多页面（组件/视图），页面之间存在多级的嵌套关系，此时，这些页面假如都需要共享一个状态的时候，此时就会产生以下两个问题：多个视图依赖同一个状态来自不同视图的行为需要变更同一个状态🤪 动动你的小脑袋你就会想到解决以上方法的方案:对于第一个问题，假如是多级嵌套关系，你可以使用父子组件传参进行解决，虽有些麻烦，但好在可以解决；对于兄弟组件或者关系更复杂组件之间，就很难办了，虽然可以通过各种各样的办法解决，可实在很不优雅，而且等项目做大了，代码就会变

2022-03-01 15:51:24 343

原创微信小程序封装request

//当页面有多个请求时,请求全部完成后关闭 loadinglet requestTime = 0export function request(params) { let baseUrl = "url地址"; requestTime++; wx.showLoading({ title: '加载中', mask: true }) return new Promise((resolve, reject) => { wx.request({

2022-02-22 17:37:30 632

原创 uni-app简单封装request请求

在根目录下新建 httpRequest 文件夹在 httpRequest 下新建api.js 和 request.js//request.jslet baseUrl = ''export default class Request { http(param) { // 请求参数 var url = param.url, method = param.method, header = {}, data = param.data || {}, token = par

2022-02-22 15:34:55 375

原创 uni-app 运行在浏览器跨域问题

在 manifest.json 根目录下配置代理 "h5": { "devServer": { "port": 8080, //端口号 "disableHostCheck": true, "proxy": { "/api": { "target": "代理域名", //目标接口域名 "changeOrigin": true, //是否跨域 "secure": false, // 设置支持https协议的代理 "pathRewrite":

2022-02-18 16:23:10 991

原创微信小程序构建npm

在项目根目录下运行 npm init初始化成功后安装组件库 npm install--save weui-miniprogram修改 project.config.json 文件中{ ... "setting": { ... "packNpmManually": true, "packNpmRelationList": [ { "packageJsonPath": "./package.json", "miniprogramN

2022-01-29 11:55:51 8795

原创微信小程序封装增删改查云函数

// 云函数入口文件const cloud = require('wx-server-sdk')cloud.init()// 云函数入口函数exports.main = async (context) => { const db = cloud.database(); //云信息 const { collectionInfo, // 操作的数据 collectionName, // 数据库表名 queryWay, // 操作方式 screen //

2022-01-07 14:27:18 395

原创判断对象是否重复

var arr = [{ "id": 1, "name": "张三" }, { "id": 2, "name": "李四" }, { "id": 3, "name": "李四" }, { "id": 4, "name": "张三" }]; //用arr的id生成一个新的数组 const newArr = arr.map(value => value.name) //将这个数组去重 const DuplicateDelete = new Set(newArr) ...

2021-12-15 11:38:43 1136

原创云函数创建集合

exports.main = async function (context) { const cloud = context.cloud; const result = await cloud.db.createCollection('prizeInfo').then(res => {//创建数据库 console.log(res,12341234) }) return result;}

2021-10-29 15:19:20 215

原创 MongoDB聚合查询

find2Collection(collectionName, screen, screen2, callback) { let find = { collectionName: collectionName, //数据库表名 queryWay: "find", //操作类型 screen: screen, //查询条件 screen2: screen2 } cloud.function.invoke...

2021-10-22 15:26:01 114

原创 js整理数组,按照指定参数分类

// 数据分类 let dataArr = []; this.data.bannerArray.map(mapItem => { if (dataArr.length == 0) { dataArr.push({ data: mapItem.data, List: [mapItem] }) } else { let res = dataArr.some(item => { //判断相同日期，有就添加到当前项 ...

2021-09-08 16:23:58 387

原创小程序实现跟手轮播非 swiper组件

小程序实现跟手轮播非 swiper组件HTML<view> <movable-area class="movable-area"> <movable-view animation="{{animation}}" damping="30" onTransitionEnd="onTransitionEnd" onChangeEnd="onChangeEnd" onTouchStart="start" onTouchEnd="end" onChange="onChan

2021-08-11 16:39:27 263

原创 vue打包后报错问题

在vue.config.vue中添加 publicPath: './', outputDir: 'dist', assetsDir: 'static',在路由index.js中添加模式为 hash 模式const router = createRouter({ mode:"hash", history: createWebHistory(process.env.BASE_URL), routes})

2021-08-10 15:42:52 737

原创 vue使用axios和配置代理

1.首先安装 axios 和 vue-axiosnpm install axiosnpm install vue-axios2.在入口文件 main.js中应用 axiosimport axios from 'axios'import vueAxios from 'vue-axios'createApp(App).use(axios,vueAxios)3.配置反向代理,在vue.config.js文件中添加module.exports = { devServer: {

2021-07-26 17:58:46 986

原创 vue实现加载更多效果

<div v-for:"item in list.slice(0,num)" :key="item"> <div>{{item}}</div></div><button @click="loadMore"></button> data () { return { num:0, //每页显示的条数 list:[...], //数据 }, methods:{

2021-07-26 11:27:21 207

原创 vue配置反向代理

1.首先在项目根目录下创建 vue.config.js 文件2.在 vue.config.js 文件中添加以下代码module.exports = { devServer: { proxy: { '/api': { target: 'http://m.baidu.com',//目标地址 ws: true, 是否启用websockets changeOri

2021-07-26 10:23:00 2558

原创 vue3.0使用rem

安装插件1、npm i amfe-flexible2、npm i postcss-px2rem在main.js中导入import 'amfe-flexible'在package.json中配置,以iPhone6为基准"postcss": { "plugins": { "autoprefixer": {}, "postcss-px2rem": { "remUnit": 37.5 } } }...

2021-07-26 10:14:28 579

原创云函数增删改查

// saveUserInfo 云函数（Node版） // TopClient = require('./topClient').TopClient;exports.main = async (context) => { try { const cloud = context.cloud;//云信息 const collectionInfo = context.data;//接收从用户端传来的信息 const collectionName = context.data.

2021-07-07 16:14:53 214

原创小程序动态文字效果

HTML<view>{{number}}</view><button onTap="start">start</button>jsimport { enhanceComponent } from 'tb-shop-enhance';Component(enhanceComponent({ data: { number: 1000000 }, onInit() { // mock数据需要修改client文件夹中的page

2021-07-03 16:55:49 462

原创淘宝小程序实现翻牌器

acss .single-demo { margin: 50rpx auto; padding: 30rpx; text-align: center; border: solid 1px #999; } .flip { display: inline-block; position: relative; width: 60rpx; height: 100rpx; line-height: 100rpx; borde

2021-07-02 17:13:12 308

原创小程序实现开屏效果

css.arrow { animation: arrow 1s linear infinite;}@keyframes arrow { 0% { transform: translateY(-5rpx); opacity: 0.3 } 25% { transform: translateY(0rpx); opacity: 0.5 } 50% { transform: translateY(4rpx); opacity: 1

2021-06-23 17:32:24 1558

原创 js实现点击按钮复制文本

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do

2021-06-17 18:05:48 104

原创 pc端响应式布局之rem

1920的屏幕1rem=100px (function (win) { var tid; function refreshRem() { let designSize = 1920; // 设计图尺寸 let html = document.documentElement; let wW = html.clientWidth; // 窗口宽度

2021-06-16 10:16:11 1023

原创小程序3D无缝轮播非swiper

css.mod{ box-sizing: border-box; display: flex; justify-content: center; flex-direction: column; align-items: center; background-repeat: no-repeat;}.nav{ display: flex; justify-content: space-between; align-items: center;}.flex{ di

2021-06-11 18:16:47 466 1

原创非scroll-view的纵向滑动

<movable-area style="height:700rpx;width: 714rpx;overflow: hidden;"> <movable-view inertia="true" direction="vertical" style="display: flex;justify-content: space-between;flex-wrap: wrap;width:714rpx;height:{{377*length}}rpx; "> ...

2021-06-08 17:02:54 141

原创 js序获取两地距离

// 判断两经纬度之间的距离var PI = Math.PI;var EARTH_RADIUS = 6378137.0;//单位Mfunction getRad(d) { return d * PI / 180.0;}function getFlatternDistance(lat1, lng1, lat2, lng2) { lat1 = parseFloat(lat1); lng1 = parseFloat(lng1); lat2 = parseFloat(lat2); ln

2021-05-21 18:15:54 245

原创数组去重

var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}]; console.log(Array.from(new Set(arr)))

2021-05-04 17:22:12 55

原创淘宝小程序 2048游戏

2021-05-04 11:19:48 372

原创屏幕分辨率

let sceenWidth = my.getSystemInfoSync().windowWidth let width = (sceenWidth) ? sceenWidth : modUtils.env.screenWidth; this.setData({ dpr: 750 / width, });

2021-04-30 16:38:57 199 1

原创 pixi.js 爆炸效果

// 爆炸效果 let bomb = 'https://img.alicdn.com/imgextra/i2/39767794/O1CN013TFOm227Rhc5a7cza_!!39767794.png' PIXI.loader.add(bomb).load(() => { let base = PIXI.utils.TextureCache[bomb] let arr = [] cons...

2021-04-28 10:56:16 497

原创 pixi.js 碰撞检测

let container = new PIXI.Container() //创建容器存放障碍物 for (var i = 0; i < 10; i++) { // 创建障碍物 let obstacle = new PIXI.Sprite(PIXI.Texture.from('https://img.alicdn.com/imgextra/i2/39767794/O1CN01lzcmmi27RhbhlMlhW_!!39767794...

2021-04-27 17:35:53 1036

原创 pixi.js 拖拽功能

// 加载狐狸 let fox = pixiTexture.from('https://img.alicdn.com/imgextra/i1/39767794/O1CN01t13qMt27RhbmdFfsh_!!39767794.png') let firfox = new pixiSprite(fox) application.stage.addChild(firfox) //移动狐狸 let flag = ...

2021-04-27 17:30:05 1462

原创 pixi.js 平铺背景

// // 平铺背景 let bgImage = PIXI.Texture.from('https://img.alicdn.com/imgextra/i4/39767794/O1CN01lmGhAG27Rhc4nj3fl_!!39767794.jpg') const tilingSprite = new PIXI.TilingSprite(bgImage, application.screen.width, application.screen.height...

2021-04-27 17:28:42 1608 1

原创淘宝小程序签到功能

my.getStorage({ key: gdc.userId + gameName, success: function (res) { // console.log(!res.data) //判断是否是第一次加载游戏 if (!res.data) { my.setStorage({ key: gdc.userId + gameName, data: { ...

2021-03-29 17:01:04 1049 1

省市区文件省市区文件省市区文件

cardSwipe.rar

空空如也