微信页面

微信小程序开发笔记(二)

别来无恙 提交于 2020-03-30 02:43:52
1.小程序代码构成   通过开发者工具快速创建了一个 wechatdemo 项目。项目里边生成了不同类型的文件:   .json为配置文件   .wxml 为模板文件,相当于HTML模板   .wxss 为样式文件,相当于HTML的CSS样式表   .js 为JS 脚本逻辑文件,相当于HTML的js脚本   一个描述整体程序的 app   多个描述各自页面的 pages   一个项目IDE配置文件 project.config.json   一个共用程序逻辑库 utils 2.一个小程序主体部分(名称为app)由三个文件组成,必须放在项目的根目录   文件       作用      必填   app.js       小程序逻辑    是   app.json      小程序公共配置  是   app.wxss      小程序公共样式表 否   2.1 一个描述整体程序的 app 之app.js文件(注册小程序项目)   1.App() 必须在 app.js 中注册,且不能注册多个。 2.不要在定义于 App() 内的函数中调用 getApp() ,使用 this 就可以拿到 app 实例。 3.不要在 onLaunch 的时候调用 getCurrentPages(),此时 page 还没有生成。 4.通过 getApp() 获取实例之后,不要私自调用生命周期函数。   其他

微信小程序新单位rpx与自适应布局

冷暖自知 提交于 2020-03-29 19:02:32
rpx是微信小程序新推出的一个单位,按官方的定义,rpx可以 根据屏幕宽度进行自适应 ,在rpx出现之前,web页面的自适应布局已经有了多种解决方案,为什么微信还捣鼓出新的rpx单位?在解释这个单位前,我们先简单了解一下目前的主流的自适应布局解决方案: 响应式( Responsive web design ) rem 流式布局 scale伸缩布局 响应式 响应式布局的问题在于需要维护多个样式文件,维护成本太大,一般的移动H5页面都不会优先考虑。 rem rem是近几年比较流行的方案,淘宝移动web端就是采用此方案,由于1rem=根元素font-size,所以rem布局的本质就是 通过rem把页面按比例分割 达到自适应的效果,因为rem是相对根路径font-size尺寸,不同的页面设置不同的font-size尺寸,即可达到自适应的效果。为了方便理解,我写了一个简单的 rem布局demo ,通过设置 document.documentElement.style.fontSize = window.innerWidth + 'px'; 然后设置 <div class="box"></div> 的宽高等于1rem,就可以使box的宽高自适应各种设备尺寸。因为box的单位1em是跟页面设备的宽对应的,所以能做到自适应各种尺寸。 流式布局 流式布局需要用到百分比或者flex

微信小程序新闻网站列表页

老子叫甜甜 提交于 2020-03-24 01:12:29
在app.json中可以设置所有文件的头部导航颜色 (是window属性的子属性) 在具体页面可以单独设置该页面的导航颜色 (直接写该属性,不需要写window属性) 查看官方文档,可以看到好多全局属性 而页面配置会覆盖部分window配置 在post.json中添加: { "navigationBarTitleText":"文与字" } 可以实现导航的文字 在小程序中,有些时候使用绝对路径会报错,比如import 因此当你使用绝对路径报错时,可以尝试换成相对路径,也许问题就解决了。 js中的data属于单向数据绑定,data中改变的数据,在wxml中会自动更新 但是在wxml中改变的数据,不会同步更新到js中(可以通过事件来完成同步) 示例: 在posts.js的data中定义date 在posts.wxml中使用双花括号绑定数据 显示 setData方法绑定数据 通常从服务器加载的数据会放到onload函数中 在post.wxml中,使用双花括号绑定数据 <!--pages/posts/posts.wxml--> <view> <swiper indicator-dots="true" interval="5000" autoplay="true"> <swiper-item><image src="/images/wx.png"></image></swiper-item>

关于微信小程序出现wx.navigateTo页面不跳转问题的解决方法

亡梦爱人 提交于 2020-03-17 15:31:10
某厂面试归来,发现自己落伍了!>>> wx.navigateTo(OBJECT) 不会销毁当前页面,仅仅是将其hide,使用wx.navigateBack可以返回到原页面。 wx.redirectTo(OBJECT) 销毁当前页面,跳转到应用内的其他页面。 我们有时候会发现,其他的地方都好好的能跳转,可是为啥突然就无效那呢? 1.检查你要跳转的位置是否在app.js中注册过。 2.检查你要跳转的地址是否有误。经常都是因为少写或者多写使得跳转无效。 3.检查你要跳转的位置是否位于TabBar中,如果是的话,要使用wx.switchTab 来跳转界面 来源: oschina 链接: https://my.oschina.net/u/3023790/blog/1806167

51助理在线客服系统使用手册V1.1

╄→гoц情女王★ 提交于 2020-03-13 14:43:16
基于助力中小企业服务提升的想法,我们团队开发了一系列产品,其中51助理在线客服系统可以帮助中小企业提升客户服务体验,支持企业客服全流程业务,包括智能客服、知识库、工单、统计报表等,具体功能和操作可以看下面详细的使用手册。 我们提供源码,可以二次开发,只需要简单的配置,App、微信、H5、网站等都可以接入,希望我们的在线客服系统能够帮中小企业解决运营中的客户服务问题,也可以帮需要相关功能组件开发团队优化成本。关于51助理在线客服系统的详细介绍可以在官网查看https://51zl.zcunsoft.com/ 以下为51助理在线客服系统使用手册V1.1,欢迎交流!咨询电话:18017366260 目 录 一、 客服端(WEB端) 1 客服模式 1 1.1 登录 1 1.2 会话 1 1.2.1 接待中的会话 1 1.2.2 已接待的会话 12 1.3 会话标签 13 1.4 我的 14 1.4.1 个人中心 14 1.4.2 退出登录 15 管理员模式 15 2.1 知识库编辑 15 2.2 常见问题编辑 17 2.3 用户管理 19 2.4 客服组管理 21 2.5 应用管理 24 2.6 基础配置 25 2.7 消息自动回复设置 26 2.8 咨询分类设置 26 2.9 客服消息推送设置 27 2.10 时间计划 27 2.10.1 工作日 27 2.10.2 节假日 28 2

微信小程序接入H5页面备忘

偶尔善良 提交于 2020-03-06 03:27:39
liren123.cn 1.微信小程序设置 index.wxml <view class="container"> <web-view src="{{webUrl}}" bindmessage="msgHandler"></web-view> //通过web-view绑定现有的H5网站页面 </view> index.js msgHandler: function (e) { //(h5像小程序传递参数) console.log(e.detail.data) //获取到来自也页面的数据 var info = (e.detail.data)[e.detail.data.length-1] this.setData({ value: info.value }); //console.log('msgHandler:value: info.value:' + this.data.value) this.setData({ title: info.title }); //console.log('msgHandler:value: info.title:' + this.data.title) }, onLoad: function (options){ var webUrl = ''; if (options.value) {//获取转发过来的参数 webUrl = options

获取微信公众号关注页面链接和历史文章链接

不打扰是莪最后的温柔 提交于 2020-02-26 10:30:53
在运营公众号时,有时需要调取公众号的历史文章列表合成以及其它相关信息,这里分享几个技巧: 1.获取微信公众号关注页面链接 我是这样获取biz值的:分享一篇该公众号的文章到QQ,然后在QQ里点开这篇文章,打开右上角3个点,复制链接,这个链接里就有biz的值了! 最终拼凑成这样子:【复制到微信中打开】 https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MjM5NTA3NzUwMQ==&scene=110#wechat_redirect   根据任一公号文章的链接地址,我们可以获取biz的值(假设为“X”),然后我们可以执行以下动作: 2.获取公众号的历史文章链接: http://mp.weixin.qq.com/mp/getmasssendmsg?__biz=MjM5NTA3NzUwMQ==#wechat_redirect   在微信环境下(微信客户端或微信网页版),点击以上链接可以查看一个公号的历史文章,历史文章的内容会动态更新。 如果你有自定义菜单,设置一个链接,你的订阅用户可以很方便查看历史文章。 3.获取公众号的二维码: http://mp.weixin.qq.com/mp/qrcode?__biz=MjM5NTA3NzUwMQ==    在浏览器输入以上地址,可以查看一个公众号的二维码图片。

微信加粉统计统计来源关键词方法

穿精又带淫゛_ 提交于 2020-02-25 23:58:59
进年来竞价推广微信加粉模式受到很多公司和个人青睐,我也做过此类竞价推广,刚开始推广时效果还不错,但长时间发现这种加粉推广无法监测推广效果,无法获取加粉来源搜索词,和访客信息,后来公司主导技术人员讨论如何监控加粉推广效果!经过几年的测试使用,效果反响还不错,今天整理了一下内容,发出来便于大家使用……   说起“微信加粉”这四个字,大家一定会想到通过微商、微信群控、公众号转发等引流加粉的营销方式,其实,有一种新型微信粉丝引流手段,正在SEM竞价排名与各大信息流广告平台上火热进行中!   揭秘“微信加粉”操作方法跟逻辑! 一:营销形式   一篇软文 + 加个人微信号 + 微信销售   新型的“微信加粉”通过在各搜索竞价平台和信息流广告平台购买流量,然后用软文的形式(文章里面留下个人微信号,引导加微信好友),最后通过微信销售产品完成流量收割。 二:适合产品和行业   适合这种营销推广方式的大多数是高利润、高回报的产品。产品官方网站 好多粉   目前通过微信加粉变现的行业,例如化妆品行业、保健品行业(减肥、丰胸、壮阳)、医疗药品行业(各类疾病)、金融行业(推荐股票)等高利润行业。   我们都知道,在各大推广平台直接推广这些产品是几乎不可能的(推广这些产品所需资质要求很高)。所以营销人员一般会先通过购买相关用户,然后加到用户的个人微信,最后在微信端完成转化。   那么,这个转换怎么实现? 三

微信小程序疫情期间逆战学习--全局配置

泪湿孤枕 提交于 2020-02-24 13:43:53
小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。 以下是一个包含了部分常用配置选项的 app.json { "pages" : [ "pages/index/index" , "pages/logs/index" ] , "window" : { "navigationBarTitleText" : "Demo" } , "tabBar" : { "list" : [ { "pagePath" : "pages/index/index" , "text" : "首页" } , { "pagePath" : "pages/logs/index" , "text" : "日志" } ] } , "networkTimeout" : { "request" : 10000 , "downloadFile" : 10000 } , "debug" : true , "navigateToMiniProgramAppIdList" : [ "wxe5f52902cf4de896" ] } 完整配置项说明请参考 [https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html] 小程序根目录下的 app

微信小程序的全局配置以及页面配置

情到浓时终转凉″ 提交于 2020-02-24 03:55:57
1、全局配置 小程序根目录下的 app.json 文件用来对微信小程序进行全局配置。文件内容为一个 JSON 对象 属性 类型 必填 描述 最低版本 pages string[] 是 页面路径列表 window Object 否 全局的默认窗口表现 tabBar Object 否 底部 tab 栏的表现 networkTimeout Object 否 网络超时时间 debug boolean 否 是否开启 debug 模式,默认关闭 functionalPages boolean 否 是否启用插件功能页,默认关闭 2.1.0 subpackages Object[] 否 分包结构配置 1.7.3 workers string 否 Worker 代码放置的目录 1.9.90 requiredBackgroundModes string[] 否 需要在后台使用的能力,如「音乐播放」 plugins Object 否 使用到的插件 1.9.6 preloadRule Object 否 分包预下载规则 2.3.0 resizable boolean 否 iPad 小程序是否支持屏幕旋转,默认关闭 2.3.0 navigateToMiniProgramAppIdList string[] 否 需要跳转的小程序列表,详见 wx.navigateToMiniProgram 2.4.0