- 博客(25)
- 收藏
- 关注
原创 uniapp 自定义下拉组件
需求:类似于淘宝京东的分类栏,以及价格排序等等原理:利用自定义的弹窗+css显示隐藏动画效果+slot来实现1、先编写好自己需要的模板样式,并将各种传值类的东西定义好特别注意:app端的slot名称无法动态改变<template> <!-- 条件选择器 --> <view class="screens-box"> <view class="screen-item" v-for="(item,index) in list" :key="i..
2022-05-31 13:29:30 2533
原创 vue 页面缓存修改 keep-alive
目的:为了每次跳转特定的路由后,返回时不会清空缓存,多用于翻页后的点击跳转。参考官方文档:https://cn.vuejs.org/v2/api/#keep-alive具体实现1、路由修改src--router--index.jsmeta: { activeMenu: '/deviceManagement/monitoringDevice',//详情页 keepAlive: true, keepAliveName: ['monitori...
2022-05-30 17:23:35 977
原创 uniapp 关于商城的分类 小米商城的滑动效果
问题:1、需要左右两侧的分栏2、两边都需要滚动3、左右需要相互定位关联4、右侧的商品栏需要单独滑动,且互不影响5、需要继续上拉的效果,且未拉至固定位置,不予翻页滚动,回弹效果6、翻页滚动回来后,商品页需要还原移动至最顶部思路:1、在uniapp中,使用scoll-view组件可以实现滑动效果+定位官方文档:https://uniapp.dcloud.net.cn/component/scroll-view.html2、单独滑动需要使用scoll-vie...
2022-05-30 16:37:11 1542 2
原创 关于uniapp map组件的使用(nvue)
1、什么是nvue在 App 端,如果使用 vue 页面,则使用 webview 渲染;如果使用 nvue 页面(native vue 的缩写),则使用原生渲染。一个 App 中可以同时使用两种页面,比如首页使用 nvue,二级页使用 vue 页面,hello uni-app 示例就是如此。https://uniapp.dcloud.net.cn/tutorial/nvue-outline.html 官方文档2.nvue的注意事项1、不能使用% vw vh (css不支持less和scss.
2022-05-25 11:41:41 6747 7
原创 uniapp checkbox样式修改
在App.vue中加入css(只能在这里。。。)/*checkbox 选项框大小 */ checkbox .wx-checkbox-input { width: 30rpx; height: 30rpx; border-radius: 50%; } /*checkbox选中后样式 */ checkbox .wx-checkbox-input.wx-checkbox-input-checked { background-color: #1a8cff; border: n
2022-02-24 15:24:25 885
原创 微信小程序中英文国际版
1.在main.js中引入vue-i18n//引入中英文import VueI18n from 'vue-i18n'Vue.use(VueI18n);const i18n = new VueI18n({ silentFallbackWarn: true, //在初始化VueI18n实例时禁止设置这些警告(同时保留那些警告给定键完 全没有翻译的警告)。 // 加载语言文件的内容 messages: { 'zh': require('./lang/zh.js').lan
2022-02-24 14:41:11 1616
原创 微信小程序连接蓝牙打印小票
001:格式<script> const LAST_CONNECTED_DEVICE = 'last_connected_device' import PrinterJobs from '../../common/printer/printerjobs' import printerUtil from '../../common/printer/printerutil' function inArray(arr, key, val) { for (let i = 0; i &
2022-02-09 09:48:37 2058
原创 slice(数组/字符串截取)、splice(数组增/删)、split(分隔字符串为数组)、substring(字符串截取--位置)、substr(字符串截取--长度)
一、slice()定义和用法数组slice()选择数组的一部分,并返回新数组。 slice()方法选择从给定的start参数开始的元素,并在给定的end参数处结束,但不包括。注:slice()方法不会改变原始数组。start 可选。整数,指定从哪里开始选择(第一个元素的索引为 0)。 使用负数从数组的末尾进行选择。如果省略,则类似于 "0"。 end 可选。整数,指定结束选择的位置。 如果省略,将选择从开始位置到数组末...
2021-12-04 15:16:26 4184
原创 Excel常用操作
删除空白行查找--定位--空值--整行删除删除空白字符=SUBSTITUTE(A1," ","")删除最后的字符=IF(RIGHT(A1)>=":",A1,LEFT(A1,LEN(A1)-1))匹配相同项=VLOOKUP
2021-11-11 10:20:53 254
转载 npm配置淘宝镜像
临时使用npm --registry https://registry.npm.taobao.org install express永久使用npm config set registry https://registry.npm.taobao.org配置CNPM这样的话,你用npm走的还是官方的,cnpm走的代理npm install -g cnpm --registry=https://registry.npm.taobao.org复制代码恢复使用npm con
2021-09-12 14:51:06 17828
原创 微信小程序邀请好友
uniapp官方:https://uniapp.dcloud.io/component/button1、使用btn触发<button class="btn" open-type="share">立即邀请好友</button>2、methodonShareAppMessage(res) { let item = { id: this.id, pid: this.infoList.user.id } console.log('id++
2021-09-11 14:39:53 4966 4
原创 时间过滤Filter的用法
1、获取得到的秒数,进行过滤filters: { datef1(val) { if (!val instanceof Date) { return; } let date = new Date(val * 1000); //秒数*1000转换为毫秒数 let year = date.getFullYear(); let month = date.getMonth() + 1; let day = date.getDate(); l
2021-09-11 11:50:54 985
原创 uniapp 微信小程序授权登录和获取电话号码
1、获取个人信息,使用uni.getUserProfile,无需button,但获取电话需要open-type="getPhoneNumber"<button v-if="!userInfo" class="submit" plain="true" @click="getUserInfo">微信授权一键登录</button> <button v-if="userInfo" class="submit" plain="true" open-type="getP...
2021-09-09 10:01:31 2825
原创 uniapp 选择并上传头像
官方文档:https://uniapp.dcloud.io/api/media/image?id=chooseimageuni.chooseImage({ //选择图片 count: 1, //图片数量默认9 sizeType: ['compressed'], //可以指定是原图还是压缩图,默认二者都有 sourceType: ['camera', 'album'],//album 从相册选图,camera 使用相机,默认二者都有。如需直接开相机或直接选相册,请.
2021-09-07 11:00:45 2321
原创 微信公众号H5重定向
let link = window.location.href;let params = getUrlParams(link);console.log('params', params)console.log('link', link)if (params.code) {console.log('code1', params.code)this.code = params.code} else { //跳转微信授权链接获取 l...
2021-09-07 10:13:16 1733
原创 H5端调起微信扫一扫的功能
微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力,为微信用户提供更优质的网页体验微信官方文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#21、这里使用npm 引入npm install jweixin.
2021-09-07 10:04:15 3150
原创 关于gitee的总结
/*--- 配置(初次配置)---*/git config --global user.name "yourname"git config --global user.email "youremail@youremail.com"Tip:查看用户名和密码git config user.name ----- 查看用户名和密码git config user.email ----- 查看用户名和密码ssh-keygen -t rsa -C...
2021-09-06 17:56:07 197
原创 根据跳转前的页面,设置不同权限
//判断跳转页 var pages = getCurrentPages(); // 当前页面 var beforePage = pages[pages.length - 2]; // 前一个页面 console.log('跳转页', beforePage.route) if (beforePage.route == 'pages/my4/my4_performance_detail') ...
2021-09-06 17:51:44 110
原创 Uniapp tabbar跳转权限
onTabItemTap(e) { // tab 点击时执行,此处直接接收单击事件 console.log('接收', e) if (this.account == 1) { this.$go("/pages/home/home") setTimeout(() => { uni.showToast({ ...
2021-09-06 17:44:26 451
原创 基于Uview 自定义tabbar 二次封装改变CSS
原样式:修改后:1、导入uview官方的tabbar组件2、找到uview-ui--->componnets-->u-tabbar-->u-tabbar.vue3、找到遍历的tabbarList,重新包裹一个盒子items4、添加items样式.items { display: flex; width: 680rpx; height: 115rpx; margin: 0 auto;...
2021-09-06 17:15:32 2905
原创 基于Uview 自定义tabbar 不同账号显示不同的tabbar
1、在package.json中将原本的修改为 "tabBar": { "list": [{ "pagePath": "pages/home/home" }, { "pagePath": "pages/my4/my4_performance" }, { "pagePath": "pages/m...
2021-09-06 16:20:14 841
原创 uniapp 微信小程序胶囊高度和title一致
//获取胶囊高度let menuButtonInfo = uni.getMenuButtonBoundingClientRect()this.titleTop = (menuButtonInfo.top) //标题文字的position:topthis.titleHeight = (menuButtonInfo.height) //标题文字的高度//背景的高度=top+height+需要的下方高度this.bgHeight = (menuB...
2021-09-06 16:05:32 1177
原创 uniapp 页面传参(对象)
//封装好的跳转函数------传递时,需要编码(由于长度限制)this.$go2('/pages/home2/search_detail?item=', encodeURIComponent(JSON.stringify(item))) ------接收时,需要解码onLoad(e){if (e.item) { let item = JSON.parse(decodeURIComponent(e.ite...
2021-09-06 15:18:25 873
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人