详细介绍微信小程序app.js

这篇具有很好参考价值的文章主要介绍了详细介绍微信小程序app.js。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

这一节,我们详细介绍app.js 这个文件。这个文件的重要性我就不再赘述,前面已经介绍了。

一、app.js是项目的主控文件

任何一个程序都是需要一个入口的,就好比我们在学c++的时候就会有一个main函数,其他语言基本都是一样。很明确的说,这里的app.js对于基于js-基础模板建立的项目,它就是我们这个项目的主控文件。

1、程序的入口

为什么说app.js是主控文件呢?因为,程序的入口在这个文件里,看到app.js中的这段代码你就自然明白了:

// app.js
App({
  onLaunch() {
    // 展示本地存储能力
    const logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)

    // 登录
    wx.login({
      success: res => {
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
      }
    })
  }
  })

我们看到Onlaunch()函数应该就明白了,这是要启动什么程序的表现。所以无疑是程序的入口了。
那么疑问来了,前面的App是什么呢?而且貌似Onlaunch这种函数都是在App后面的括号里面,难不成他是?
没错,它就代表这个微信小程序这个项目。

2、App对象

首先我们来看看微信开发者文档的说明:
App(Object object)
注册小程序。接受一个 Object 参数,其指定小程序的生命周期回调等。
App() 必须在 app.js 中调用,必须调用且只能调用一次。不然会出现无法预期的后果。

从上面的描述,我们应该清楚了,App()就只在实例化一个App类,只不过这个类的实例化需要的参数大多数用函数作为参数,当然也可以是任何变量。具体参看下表:

属性 类型 默认值 必填 说明
onLaunch function 生命周期回调——监听小程序启动或切前台。
onShow function 生命周期回调——监听小程序启动或切前台。
onHide function 生命周期回调——监听小程序切后台。
onError function 错误监听函数。
onPageNotFound function 页面不存在监听函数。
onUnhandledRejection function 未处理的 Promise 拒绝事件监听函数。
onThemeChange function 监听系统主题变化。
其他 any 开发者可以添加任意的函数或数据变量到 Object 参数中,用 this 可以访问

查看上述类容,我们可以在微信小程序官方文档中“框架->框架接口->小程序app->APP"目录下查看

二、如何使用呢?

官方的开发文档一般都是给有基础的童鞋准备的,看完文档,我相信还是有一部分新手看不懂或者似懂非懂,也就是说不怎么会用,那么怎么用呢?

1、理解作为参数的函数

比如,App()中那些用来作为参数的函数,他们的参数列表中都会有一个Object类型的参数,如onLaunch的说明如下:
onLaunch(Object object)
小程序初始化完成时触发,全局只触发一次。参数也可以使用 wx.getLaunchOptionsSync 获取。
参数:与 wx.getLaunchOptionsSync 一致

但,我们实际的小程序项目中的app.js中的onLaunch函数却没有参数列表,没有参数。如果给它一个参数,给什么参数,这个参数又由谁传给他们?什么时候传给他们?

2、参数函数的参数

我们先做一个尝试,先打开小程序中的app.js,并在onLaunch函数的参数列表中随意写一个变量msg作为参数,当然也可以是任何其他非关键字的变量。代码如下:

 onLaunch(msg) {
    // 展示本地存储能力
    const logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)
     console.log("页面的路径是:"+msg.path)
     }

运行结果是,控制台输出了:
微信开发者工具app.js,移动App,微信小程序,javascript,小程序,app.js,介绍onLaunch文章来源地址https://www.toymoban.com/news/detail-852626.html

到了这里,关于详细介绍微信小程序app.js的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序开发者工具下载

    微信开发者工具下载地址与更新日志 | 微信开放文档 (qq.com) 下载安装好后,软件图标如下图所示。 运行软件如下图所示,这时候就需要使用你的管理员账号扫码登录。 登陆后的界面,如下图所示。可以项目分为两类: 小程序项目、公众号网页项目 。其中,小程序项目又细

    2024年04月23日
    浏览(125)
  • [微信小程序开发者工具] × #initialize

    [微信小程序开发者工具] × #initialize-error: [error] 工具的服务端口已关闭。要使用命令行调用工具,请在下方输入 y 以确认开启,或手动打开工具 - 设置 - 安全设置,将服务端口开启。 从HBuilder运行到微信小程序的时候报错 解决办法: 打开微信开发者工具,选择设置–通用设

    2024年02月11日
    浏览(79)
  • 快速上手微信小程序(纯原生)基于微信开发者工具+云开发

    最近开发一个小程序。因为体量实在不大,两张表,几个接口。便打算写原生的代码。没有使用uniapp等框架。记录一下一个小程序从搭建到审核发布的那些坑和经验做为学习笔记。 几个网站请收藏 你的小程序需要开发工具: 保姆级传送门 你的小程序需要一个身份证: 微信公

    2024年02月10日
    浏览(85)
  • 微信小程序:微信开发者工具安装less插件

    微信小程序:本文主要是关于如何在微信开发者工具中安装less插件 不知道大家有没有像我一样习惯在vscode里面用惯了less,当需要用微信开发者工具开发小程序时,如果没有这个会有些不习惯,下面就简单介绍一下,如何在微信开发者工具中安装less插件。 less:是一个CSS预处

    2024年02月14日
    浏览(152)
  • 【微信小程序】微信开发者工具安装less插件

    微信小程序:本文主要是关于如何在微信开发者工具中安装less插件 不知道大家有没有像我一样习惯在vscode里面用惯了less,当需要用微信开发者工具开发小程序时,如果没有这个会有些不习惯,下面就简单介绍一下,如何在微信开发者工具中安装less插件。 less:是一个CSS预处

    2024年02月04日
    浏览(79)
  • 【微信小程序】--注册小程序账号&安装开发者工具(一)

    💌 所属专栏:【微信小程序开发教程】 😀 作  者:我是夜阑的狗🐶 🚀 个人简介:一个正在努力学技术的CV工程师,专注基础和实战分享 ,欢迎咨询! 💖 欢迎大家:这里是CSDN,我总结知识的地方,喜欢的话请三连,有问题请私信 😘 😘 😘   大家好,又见面了,

    2024年01月17日
    浏览(114)
  • 【微信小程序】微信Web开发者工具下载及安装

    🏆今日学习目标:微信Web开发者工具下载及安装 😃创作者:颜颜yan_ ✨个人主页:颜颜yan_的个人主页 ⏰预计时间:25分钟 🎉专栏系列:微信小程序开发 什么是微信小程序? 小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者

    2024年02月09日
    浏览(86)
  • 微信小程序实现简单的点击切换功能(微信开发者工具)

    📚文章目录 🔗首先创建一个简单的切换按钮📋 如图下  📋wxml代码  📋wxss代码 🔗但是这个元素是无法点击的,所以要添加一个点击事件到这两个元素里面  📋js代码(在page({})里面添加) 📋wxml代码  🔗class使用三元表达式来继续点击判断  🔗使用bindtap绑定事件  事件的

    2024年02月09日
    浏览(210)
  • 小程序用户隐私新规,微信小程序开发者需满足新要求

    微信公众平台运营中心最新公告指出,从2023年9月15日开始,涉及处理用户个人信息的小程序开发者需要满足新要求。开发者须主动同步用户同意并遵守小程序的隐私保护指引和其他信息处理规则,方可调用微信提供的隐私接口。 并且,在确认小程序是否涉及处理用户个人信

    2024年02月09日
    浏览(62)
  • 【HbuilderX+微信小程序开发者工具解决报错问题】

    一定要正确的配置运行终端 包括 浏览器 、 小程序 安装路径等,还包括小程序的appid,并且要和申请的帐号匹配的登录才能正常的运行 进入微信公众平台https://mp.weixin.qq.com/登录 扫码确认 点击 首页-》配置服务-》开发设置 ,查询appId 如下图 问题描述 [微信小程序开发者工具

    2024年02月09日
    浏览(71)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包