小程序导航

微信小程序时代已经来临

为君一笑 提交于 2020-03-27 23:44:48
昨天估计微信公众号上产生了第一篇最快的30万+文章,10万+只花了10多分钟。就是冯大辉(著名Oracle专家,知名博主)同学的「微信应用号来了」。 为什么这么一篇如此简单又技术类的文章一下能刷遍朋友圈,原因是这个小程序将会影响整个中国甚至世界应用的开发格局和策略。 张小龙昨天晚上写道: 「什么是小程序:小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用。也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。」 如果你做手机客户端开发,其实真正麻烦的是,你必须做大量的兼容性适配,而且需要永无停止的升级兼容性适配。6个月之内别别想搞利落一个应用,甚至跟技术水平无关。 在面对瞬息万变的创业市场,这么慢完全不如去炒房子,还创什么业啊。 如果你做微信服务号呢,你可以几天上线。但是问题也来了,某些方面由于纯基于HTML5,再基于微信对话框这个容器,用户体验不好,限制也很多。 但是微信小程序来了之后,从目前公开的资料来看,彻底解决了这些问题,将开发成本和学习成本大幅降低。 虽然不能变成人人都是程序员,人人都是开发者,但是很多没有经验的程序员也可以快速学习入门,学习小程序开发了。由于开发成本的降低和学习成本的降低,无数公司的个性化需求将会得到释放和可能。 如果说微信连接一切是马车

WordPress版微信小程序2.6版发布

雨燕双飞 提交于 2020-03-21 03:57:06
WordPress版微信小程序 的完善和升级的工作一直都在进行中,我争取保证一个月可以出一个版本,希望通过一点点的改进,让这个开源产品日趋完美。 同时,pro版WordPress微信小程序也在紧锣密鼓的开发中,这个过程有些反复,如何在性能和功能上优于当前的开源版本?是我一直想解决的问题。pro版本包括什么功能,现在还没有完全确定,希望pro版本出来后,不会让大家失望。 当然当前的开源版本也还有很多地方值得去优化,了解程序的开发历程及开发技术,建议看看相关更新文章和安装文档: 1.用微信小程序连接WordPress网站 2.WordPress版微信小程序1.5版本发布 3.WordPress版微信小程序2.0版本发布 4.利用WordPress REST API 开发微信小程序从入门到放弃 5.WordPress版微信小程序2.1.5版发布 6.WordPress版微信小程序2.1.8版发布 7.WordPress版微信小程序开发系列(一):WordPress REST API 8.WordPress版微信小程序2.2.0版发布 9.WordPress版微信小程序2.2.8版发布 10.WordPress版微信小程序开发系列(二):安装使用问答 11.WordPress版微信小程序2.4版发布 12.WordPress版微信小程序安装使用说明 开源下载地址 https:/

微信小程序页面跳转导航wx.navigateTo和wx.redirectTo

本小妞迷上赌 提交于 2020-03-17 15:19:48
某厂面试归来,发现自己落伍了!>>> 在 微信小程序 里面如果有多个页面肯定有页面跳转,例如,当用户扫一扫 微信小程序 二维码后,就进入到了小程序的首页里面,然后,点击某个分类就进入到了这个分类的列表页,点击列表页的某一链接的标题后就进行到了这个链接的内容页,当然,也可以从小程序的首页直接进入到内容页里面。 从小程序的首页到列表而再到内容页,是一步一步的跳转的,也就是说一般的小程序都会从一个页面跳转到另一个页面(当然,有的小程序只有一个页面,例如,计算器、房税计算等,这样的小程序比较少),如果想回到前一个页面可以点击小程序左上角的符号“<”即可返回到前一页。 类似小程序这样的跳转是由小程序框架提供的接口实现的,这几个接口是:wx.navigateTo(OBJECT)、wx.redirectTo(OBJECT)、wx.navigateBack(OBJECT)和wx.switchTab。 下面分别介绍这几个功能的使用区别与联系: wx.navigateTo(OBJECT) 这个接口是跳转到一个应用内的某个页面,但是,保留着当前页面,这句话不好理解什么是保留着当前页面? 如下图所示: 如果使用接口wx.navigateTo的话,当点击“A页面”进入到“B页面”后,“A页面”仍然存在,如果从“B页面”进入到“C页面”,“A页面”和“B页面”都会保留着。 这样有一个好处是,如果想从“C页面

微信小程序从零开始开发步骤(四)自定义分享的功能

断了今生、忘了曾经 提交于 2020-03-12 03:07:20
上一章节,实现了小程序的底部导航的功能,这一节开始实现一些简单的功能。本章节介绍的是小程序的自定义分享的功能。 可以分享小程序的任何一个页面给好友或群聊。注意是分享给好友或群聊,并没有分享到朋友圈。一方面微信在尝试流量分发方式,但同时又不愿意开放最大的流量入口。 开发文档: https://mp.weixin.qq.com/debug/wxadoc/dev/api/share.html?t=20161221 实现步骤很简单 在index/index.js里面添加了一段自定义分享的代码如下, path: '/page/index?id=123',实现了index首页页面的分享功能 示例代码: Page({ onShareAppMessage: function () { return { title: '自定义分享标题', desc: '自定义分享描述', path: '/page/index?id=123' } } }) 解释一下意思: Page()中加上如下代码后在右上角意思 title:分享的标题. desc:分享一段描述. path:这个参数以前在微信中的分享一般都是url.这里pages/index?id=123是在首页页面设置分享的意思。 下一章:微信小程序从零开始开发步骤(五)简单的轮播图 原理: 在 Page 中定义 onShareAppMessage 函数

小程序开发之 导航组件(navigator)

人走茶凉 提交于 2020-02-22 18:42:01
效果图 属性 参考: navigator 实例 app app.js App ( { onLaunch : function ( ) { console . log ( 'App Launch' ) } , onShow : function ( ) { console . log ( 'App Show' ) } , onHide : function ( ) { console . log ( 'App Hide' ) } , globalData : { hasLogin : false } } ) app.json { "pages" : [ "pages/pageA/navigator" , "pages/pageB/navigate" , "pages/pageC/redirect" , "pages/pageD/pageD" ] , "tabBar" : { "list" : [ { "pagePath" : "pages/pageA/navigator" , "text" : "页面A" } , { "pagePath" : "pages/pageD/pageD" , "text" : "页面D" } ] } , "window" : { "backgroundTextStyle" : "light" , "navigationBarBackgroundColor"

微信小程序面试题总结

我的梦境 提交于 2020-02-20 12:49:27
A类问题 1 请谈谈微信小程序主要目录和文件的作用? project.config.json 项目配置文件,用得最多的就是配置是否开启https校验; App.js 设置一些全局的基础数据等; App.json 底部tab, 标题栏和路由等设置; App.wxss 公共样式,引入iconfont等; pages 里面包含一个个具体的页面; index.json (配置当前页面标题和引入组件等); index.wxml (页面结构); index.wxss (页面样式表); index.js (页面的逻辑,请求和数据处理等); 2 请谈谈wxml与标准的html的异同? 都是用来描述页面的结构; 都由标签、属性等构成; 标签名字不一样,且小程序标签更少,单一标签更多; 多了一些 wx:if 这样的属性以及 {{ }} 这样的表达式 WXML仅能在微信小程序开发者工具中预览,而HTML可以在浏览器内预览 组件封装不同, WXML对组件进行了重新封装, 小程序运行在JS Core内,没有DOM树和window对象,小程序中无法使用window对象和document对象。 3 请谈谈WXSS和CSS的异同? 都是用来描述页面的样子; WXSS 具有 CSS 大部分的特性,也做了一些扩充和修改; WXSS新增了尺寸单位,WXSS 在底层支持新的尺寸单位 rpx; WXSS 仅支持部分 CSS

【小程序技术点】navigator不能跳转到有tabBar页面的解决

你说的曾经没有我的故事 提交于 2020-02-19 12:41:54
在微信小程序开发中,页面包含tabBar能使整个页面变的美观而又整洁。与此同时,navigator能作为导航链接,很方便的跳转到其它页面。 但在使用的时候,很多人会发现直接使用navigator不能跳转到含有tabBar的界面。解决方法很简单,就是在使用navigator时加个参数,如下: <navigator url="/pages/index/index" class='white' open-type='switchTab'>开始</navigator> 如上面的代码,只要在使用navigator时添加open-type=’switch’就可以实现跳转到含有tabBar界面的功能 来源: https://www.cnblogs.com/EarlyBridVic/p/12330558.html

微信小程序-导航组件 navigator

試著忘記壹切 提交于 2020-01-31 06:14:40
微信小程序-导航组件 navigator demo.wxml <!-- 导航组件 navigator 0 块级元素 默认会换行 可以直接加高度和宽度 1 url 要跳转的页面路径 绝对路径 相对路径 2 target 要跳转到当前的小程序 还是其他的小程序页面 self 默认值 自己 小程序的页面 miniProgram 其他的小程序的页面 3 open-type 跳转的方式 1 navigate 默认值 保留当前页面 跳转到应用内的某个页面 但是不能跳到 tabbar 页面 2 redirect 关闭当前页面 跳转到应用内的某个页面 但是不能跳到 tabbar 页面 3 switchTab 跳转到 tabbar 页面 并关闭其他所有非 TabBar 页面 4 reLaunch 关闭所有页面,打开到应用内的某个页面 --> < navigator url = " /pages/demo09/demo09 " > 轮播图页面 </ navigator > < navigator url = " /pages/index/index " > 直接跳转到 TabBar 页面 </ navigator > < navigator open-type = " redirect " url = " /pages/demo09/demo09 " > 轮播图页面 redirect </

微信小程序--helloworld

丶灬走出姿态 提交于 2020-01-13 01:16:51
小程序使用的是微信自己开发的MINA框架,提供了试图层描述语言。MINA框架中的四种类型的文件: .js文件-基于JavaScript的逻辑层框架 .wxml视图层文件-是MINA设计的一套标签语言 .wxss样式文件-用于描述WXML的组件样式 .json文件-配置文件,用于单个页面的配置和整个项目的配置 新建项目打开的时候会自动创建一个demo,demo的结构文件树如下: 文件树 3.当中的app.js、app.json、app.wxss是必不可少的,是小程序生成的依赖文件。 app.js是小程序的脚本代码,用来监听并处理小程序的生命周期函数、声明全局变量。 app.json是对整个小程序的全局配置,配置小程序是由哪些页面组成,配置小程序的窗口标题、背景颜色等。 app.wxss是整个小程序的公共样式表。 Hello world实例分析: app.js 针对上述代码的API介绍: App:注册一个小程序 onLunch:程序加载时执行的方法 getStorageSync:以同步的方式获取本地缓存 setStorageSync:设置缓存 wx.getUserInfo:获取用户信息 app.json pages为注册页面的列表,均为相对路径,配置小程序由哪些页面组成,window配置小程序的窗口背景色、配置导航条样式、配置默认标题等。 来到页面的部分,看看index文件中的内容

微信小程序入门心得

蓝咒 提交于 2020-01-12 05:01:45
写这个小程序例子好久了,但是一直也没把总结的东西,写下来,正好最近注册了这个博客,所以把它最为第一篇文章,希望能有地方,帮到大家。 1.开发过程 第一步: 小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。主程序 app 主要由三个文件组成,分别是 app.js(小程序逻辑)、app.json(小程序公共设置)和 app.wxss(小程序公共样式表),其中前两个为必备文件。 app.js 这个文件是整个小程序的入口文件,开发者的逻辑代码在这里面实现,同时在这个文件夹里面可以定义全局变量. app.json五个配置项列表.(pages(Array) , window(Object), tabBar(Object), networkTimeout(Object), debug(Boolean)),这其中networkTimeout又有四种网络请求:1.普通HTTPS请求(wx.request) 2. 上传文件(wx.uploadFile) 3.下载文件(wx.downloadFile) 4.WebSocket通信(wx.connectSocket),前3项都好理解,第4项是H5的一种新的协议,是可以浏览器与服务器双向通信的。大家有时间可以看看http://blog.csdn.net/he90227/article/details/48576039