首页 > 编程语言 >微信小程序开发1

微信小程序开发1

时间:2023-10-15 12:02:05浏览次数:33  
标签:微信 代码 程序开发 程序 跳转 分享 页面

index.wxml文件中:

根据我们前面说的官方文档学习可以大概知道,这个文件里主要涉及到的是前端代码,所以这里就比较简单了,写上你要展示的前端代码就行:

在微信页面中的视图容器<view>标签来写,这个标签相当于html页面中的<div>标签,我们看看官方文档介绍

微信小程序开发1_微信


主要还是负责一些位置控制啥的,理解起来也不难吧。

navigator标签比较重要,这个就是负责跳转的,可以通过设置跳转链接,跳转到其它页面,如下:

微信小程序开发1_提交审核_02


当然我们这边因为是要跳转到其它小程序中,所以这边就不是url,而是通过设置APP-id来进行,每个小程序都有自己专属的唯一id,可以在小程序中的更多资料中查看到,如下截图:

微信小程序开发1_提交审核_03


然后设置背景图标可以通过style中的background-image:url设置,来看下单个小程序入口和图标设置代码吧

这样就写好了一个小程序入口啦,是不是很简单,剩下的就是依次复制黏贴了;这样看来这个是不是很好写,简直是我们小白的入手好项目啊!老铁们动起来。

然后在index.wxss中对对应的view标签设置展示样式就行了,具体你想要怎么展示那就看自己想象力了,自行查询方法就可实现了,比如这样的

微信小程序开发1_提交审核_04


app.js文件:

微信小程序开发1_提交审核_05


每个小程序都需要在 app.js 中调用 App 方法注册小程序实例,绑定生命周期回调函数、错误监听和页面不存在监听函数等

app.json文件:

微信小程序开发1_微信_06


这个文件主要是负责配置小程序中的页面显示:

比如pages{}中配置的页面路径,默认打开小程序时就是按第一个页面路径显示,当然你要显示的页面都必须在这里面配置路径

然后想tabBar{}这个里面就是配置小程序下面tab栏的页面的

当然还有些其它的功能大家可以自己百度查找哈


这样处理完后我们小程序主要功能算是实现了,在编辑器里调试下,能正常跳转,大功告成,可以发布了?是的,我也以为可以发布了,忽略了一个很重要的问题,我们这样写功能是没问题,但是你知道小程序如果想要点击右上角分享到朋友圈和群或者好友是需要在各个页面单独设置吗???我猜大多数刚接触的小白都不知道吧,至少我第一次是不知道的,所以我当时就傻乎乎的提交了代码审核,然后审核通过后傻乎乎的把小程序的二维码分享到朋友圈和群里面。然后发现访问量并没有起来。为啥呢???

很简单,大家时间宝贵(很懒),谁愿意多花一秒钟去用手机扫码访问一个自己从来没访问过的小程序?所以我分享二维码的方式简直蠢到家了,没几个人愿意扫码去看的。哎,失策失策!!!

当我反应过来想要去小程序分享时才发现。OMG,点击右上角出来的分享弹框中,分享到好友和朋友圈居然是置灰不可点击的,当时我还疑问,是不是我的小程序访问量不够,微信那边还没放开分享功能(毕竟微信很多做法一直口碑不好),我还苦恼了半天,后面去网上查了下才发现,其实分享是需要添加代码的,要不然你的小程序永远分享不出去的,按钮永远是置灰的。。。各位小白们一定要记住这个坑!!!切勿再踩了!!!

所以现在我们来看下如何让你的小程序支持分享吧:

其实想要实现起来还是很简单的,就是在你对应页面的js文件中添加下面代码:

加上这个后,点击右上角分享图标就不置灰了

微信小程序开发1_提交审核_07


OK,是不是很简单,代码加完了,继续提交代码,提交审核,嗯,高高兴兴提交代码,结果被微信的审核员驳回了!!!WC,我只加了个分享代码就给我驳回了,是不是扯???给的驳回理由也很扯:

微信小程序开发1_微信_08


说无具体运营功能,那为啥我第一次提交审核的时候给通过了呢?很迷的审核操作有没有。好吧,既然说我无具体功能,那么我就加功能,这就是大家看到截图中加的“记事本”tab的功能,纯粹是为了过审的,没办法啊,你在人家平台上开发东西,只能低头了。就算是再学点其它知识吧!

说干就干,下一篇:记事本功能搞起来!!!!



标签:微信,代码,程序开发,程序,跳转,分享,页面
From: https://blog.51cto.com/u_16303101/7870456

相关文章

  • 基于微信小程序的明星应援小程序设计与实现(源码+lw+部署文档+讲解等)
    (文章目录)前言:heartpulse:博主介绍:✌全网粉丝10W+,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java、小程序技术领域和毕业项目实战✌:heartpulse:......
  • 小工具 -- 微信/QQ防撤回
    RevokeMsgPatcher软件的名字叫RevokeMsgPatcher,在GitHub上开源。软件截图如下:功能包括微信&QQ&TIM&QQ轻聊版防撤回、多开等。使用方法也非常简单(以微信为例)先关闭软件,然后打开工具选择软件路径,点击安装补丁即可。注意事项:升级或者重新安装微信后需要RevokeMsg......
  • 【网站公告】切换微信扫码登录所使用的服务号
    大家好,我们计划于10月14日(周六)上午切换微信扫码登录所使用的服务号,由“i博客园”切换到“博客园Cnblogs”,切换后首次微信扫码登录需要先关注新服务号,由此给您带来麻烦,请您谅解。也可以现在提前关注新服务号“博客园Cnblogs”,以下是新服务号的二维码:另外,欢迎您关注园子的微信公......
  • 微信支付 Verify the signature and get the Wechatpay certificate corresponding to
    1.先获取商户证书文件这块叫商户证书需要和下面的支付证书名字区分在微信开放平台里面下载商户证书,用apiclient_cert.pem取获取'商户证书的序列号'证书查看  2.需要下载一个jar,生成微信证书时候用Releases·wechatpay-apiv3/CertificateDownloader·GitHub  3......
  • 系统文件损坏+重装系统微信记录保留
    系统文件损坏——不能启动进入系统;1、winPE进入命令提示符——输入sfc/scannow/offbootdir=c:\/offwindir=c:\windows等待执行完成,显示修复成功,重启即可进入系统(winPE可以是U盘PE) 重装系统微信记录保留办法;重置系统前备份2个文件:1、C:\Users或者用户\你电脑的用户名\AppDa......
  • 微信小程序scroll-view
    <!--纵向滚动--><scroll-viewclass="myScroll"scroll-y><viewclass="row">1</view><viewclass="row">2</view><viewclass="row">3</view><viewclass="row&q......
  • 报错解决:java.security.InvalidKeyException: Illegal key size(微信支付v3遇到的问
    前言在使用微信支付v3生成jar包后本地测试没有问题在开发小程序支付功能的时候:本地开发好好的,放在linux服务器上运行时碰到报错原因是因为微信支付256位秘钥加密解密策略 可能会导致某些jdk的版本加密解密出现问题解决首先观察你这个目录下的文件根据文件内容做判断看下......
  • 调用微信接口返回openid
    privateStringgetOpenId(Stringcode){Stringurl="https://api.weixin.qq.com/sns/jscode2session";HashMapmap=newHashMap();map.put("appid",appId);map.put("secret",appSecret);m......
  • 导出微信支付交易明细证明账单记录修改删除PDF文件
    微信支付交易明细证明有两种修改方式,一种是导出账单到邮箱后再下载PDF账单文件到电脑桌面进行修改。第二种是导出前在后台修改,这种情况较为复杂要根据个人情况而定,暂不做陈述。现在先来说说第一种方式,先下载账单文件然后把PDF转成WORD的方式进行修改,这种方式简单粗暴,相信很多人都......
  • 微信小程序商城分类滚动列表锚点(左菜单右列表)
    1、TestScroll.wxml<viewclass="content-box"><!--左侧分类--><scroll-viewscroll-yscroll-with-animationclass="left"style="width:245rpx;height:100%;background:#f2f2f2;"scroll-into-view='{{leftId}}&#......