自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

FaxMiao的博客

web前端开发

  • 博客(16)
  • 资源 (2)
  • 收藏
  • 关注

原创 微信小程序:页面跳转及参数传递

本文首发自个人自有博客:【FaxMiao个人博客】,一个关注Web前端开发技术、关注用户体验、记录前端点滴,坚持更多原创,为大家提供高质量技术博文!前言小程序的跳转方法有很多种,有的人一直只用wx.navigateTo跳转,由于页面栈限制,跳着跳着小程序就没反应了,今天就来说小程序的跳转几种跳转方式及作用。正文一、wx.switchTab跳转到 tabBar 页面,并关闭其他所有非...

2020-03-28 16:30:14 2742 1

原创 微信小程序自定义navigationBar顶部导航栏,兼容适配所有机型(附完整案例)

前言navigationBar相信大家都不陌生把?今天我们就来说说自定义navigationBar,把它改变成我们想要的样子(搜索框+胶囊、搜索框+返回按钮+胶囊等)。正文1.隐藏原生的navigationBarwindow全局配置里有个参数:navigationStyle(导航栏样式),default=默认样式,custom=自定义样式。"window": { "navigation......

2020-03-26 09:38:27 12388 9

原创 深入理解CSS3动画:animation、transform、transition

前言在CSS3之前,动画主要都是以JavaScript或者Gif图片来实现,但是实现效果并不是很理想或者很麻烦,有了CSS3之后很多动画几句代码即可实现,方便,快速,性能好。目录animationtransformtransition一、animation我们通过一个简单的例子来理解:延迟1秒执行,从左0往右100px无限循环来回移动;div { width: 80px...

2020-03-22 17:54:44 377

原创 Git下载、安装及环境配置(超详细)

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

2020-03-17 14:59:19 46307 9

原创 微信小程序实现锚点效果 scroll-view的scroll-into-view属性

小程序中实现锚点效果,可以直接使用scroll-view的scroll-into-view属性就可以实现锚点效果,比较方便简单。那么需要用到scroll-view那些参数呢,下面具体讲讲:效果展示:wxml**注意:**viewid值是动态的,通过setData设置即可。jswxss......

2022-06-06 17:38:50 4449 3

原创 微信小程序设置git提交、代码管理

首先,把已建好git库(如未创建请先对git进行配置【git下载、安装及常规环境配置】)项目导入开发者工具。1.点击开发者工具右上角版本管理,然后点击设置。2.设置用户信息(填写你的git账号:昵称+邮箱),下次提交时将会使用此用户信息。3.设置用户名和密码(git的账号密码)4.设置远程git地址5.设置完成,可以在操作区进行代码推送、拉去等操作了。...

2022-05-25 11:28:30 4162 1

原创 [微信小程序] 动态设置页面标题、导航条 navigationBarTitleText

前言navigationBarTitleText用于小程序设置当前页面标题,可以给每个页面设置独立的标题,但是这样不能满足一些特殊业务场景;比如说商城,商品详情页面的标题,会根据获取到的数据动态修改,下面就来说说如何动态修改标题以及导航条相关设置。正文一、wx.setNavigationBarTitle1.设置整个小程序通用标题,在app.json里设置:"window": { "navigationBarTitleText": "默认标题"}2.单独设置页面标题,在对应页面json

2022-05-24 15:28:04 21893

原创 获取view宽高度、获取自定义组件宽高度

一、获取view宽高度给view设置一个id(class)名,用法和jQuery类似,用来获取指定id相关信息。<view id="test">测试view</view>把方法写在onReady,是为了再页面初次渲染完成后,再去获取,避免不准确或获取不到的情况。onReady: function (e) { const query = wx.createSelectorQuery(); query.select('#test').boundingClientRect(f

2020-06-18 15:19:58 702 1

原创 微信小程序:setData函数详解及注意事项

前言在微信小程序中经常会使用到setData函数把变量渲染到视图层,那么什么是setData呢?如何使用?注意事项有些什么?下面我们就来详细了解一下!正文setData是小程序开发中使用最频繁的接口,也是最容易引发性能问题的接口。setData函数用于将数据从逻辑层渲染到视图层(异步),同时改变对应的this.data的值(同步)。实例1:简单实现点击修改变量值<text&g...

2020-04-30 16:13:10 3973

原创 微信小程序:获取地理位置

一、wx.getLocation(OBJECT)获取当前的地理位置、速度。当用户离开小程序后,此接口无法调用。开启高精度定位,接口耗时会增加,可指定highAccuracyExpireTime作为超时时间。属性类型默认值必填说明typestringwgs84否wgs84 返回 gps 坐标,gcj02 返回可用于wx.openLocation的坐标alt...

2020-04-13 16:51:30 3964

原创 CSS3布局:多列布局、分栏

以前,如报纸类型排版,要用CSS动态实现其实是比较困难的,因为内容是动态的,每个div显示多少文字是很难控制的。现在CSS3提供了个新属性columns用于多列布局,下面我们就来详细看看。正文一、column-count指定了需要分割的列数;语法:column-count: number | auto;<div class="box"> FaxMiao个人博客是一个we...

2020-04-03 18:51:51 1392

原创 微信小程序开发那些事,你都知道吗?

在开发小程序的时候,或多或少都会遇到些问题,也有很多容易被忽略的问题;前端以提升用户体验为主,适当规避问题、优化代码可提升性能,可大大提升用户体验。注意事项:1.自定义组件内wxss里不能使用标记选择器、ID选择器、属性选择器;/* 错误 */#id{...}image{...}a[href]{...}/* 正确 */.class{...}2.wx:for必须和wx:ke...

2020-04-01 15:57:52 283 1

原创 微信小程序:动态设置页面标题、导航条

前言navigationBarTitleText用于小程序设置当前页面标题,可以给每个页面设置独立的标题,但是这样不能满足一些特殊业务场景;比如说商城,商品详情页面的标题,会根据获取到的数据动态修改,下面就来说说如何动态修改标题以及导航条相关设置。正文一、wx.setNavigationBarTitle1.设置整个小程序通用标题,在app.json里设置:"window": { ...

2020-03-30 17:26:53 2749

原创 微信小程序:消息提示框

本文首发自个人自有博客:【FaxMiao个人博客】,一个关注Web前端开发技术、关注用户体验、记录前端点滴,坚持更多原创,为大家提供高质量技术博文!前言相比H5弹出框的实现方式要么用插件,要么自己写;微信小程序则提供了几个弹出框api,使用起来更简单、方便;每个api都有不同的使用方式、场景,今天我们就来说说小程序的几种弹出框。目录wx.showToast()wx.showModa...

2020-03-29 16:23:35 4533

原创 快速学会小程序参数传递与路径获取

首先在小程序中,所有页面的路由都由框架统一管理。getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。// 获取加载的页面对象const pages = getCurrentPages();// 获取当前页面的对象const currentPage = pages[pages.length - 1];tip...

2020-03-18 14:25:08 1005

原创 [微信小程序] 单张、多张图片上传(图片转base64格式)实践经验

定义初始数据:data: { imgList: [], // 图片集合 baseImg: [], // base64图片集合 maxImg: 8, // 图片上传最高数量(根据需求设置)}第一步:从本地相册选择图片或使用相机拍照(wx.chooseImage)// 选择图片selectPictures: function() { const that =...

2020-03-17 15:20:51 5490 4

微信小程序实现锚点效果,方法简单实用!

微信小程序实现锚点效果,方法简单实用!

2022-06-06

[微信小程序] 自定义顶部导航栏(navigationBar),兼容适配所有机型(完整实例)

微信小程序自定义navigationBar顶部导航栏,兼容适配所有机型(完整案例),本示例主要讲述如何隐藏掉小程序顶部导航栏,然后设置自定义navigationBar,其中涉及组件用法、参数传递、导航栏相关等,简单点来说就是将微信原生顶部导航栏改为自定义导航栏。

2022-05-25

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除