返回顶部
首页 > 资讯 > 前端开发 > html >微信小程序如何引用公共js里的方法
  • 716
分享到

微信小程序如何引用公共js里的方法

2024-04-02 19:04:59 716人浏览 独家记忆
摘要

这篇文章将为大家详细讲解有关微信小程序如何引用公共js里的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。微信小程序引用公共js里的方法的实例详解一个小程序页面由四个文

这篇文章将为大家详细讲解有关微信小程序如何引用公共js里的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

微信小程序引用公共js里的方法的实例详解

一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件。可是当有些公共方法,我们想抽离出来成为一个独立公共的js文件。我们该如何实现呢。

微信小程序如何引用公共js里的方法

在根目录下有一个app.js文件。这个根目录的js 文件我们可以通过getApp()轻松调用。

//app.js

App({
  globaData:'huangenai'
 })
//test.js
var app = getApp();
Page({
 onLoad: function () {
 console.log(app.globaData);
 } 
})

开发工具的 Console可以看到

微信小程序如何引用公共js里的方法

 那么当一些通用的公共方法我们抽出来,在根目录下有个utils文件夹(没有的话新建),里面util.js(没有的话新建)在这里我们可以将通用的方法写在这。

util.js

//正则判断
function Regular(str, reg) {
 if (reg.test(str))
  return true;
 return false;
}

//是否为中文
function IsChinese(str) {
 var reg = /^[\u0391-\uFFE5]+$/;
 return Regular(str, reg);
}
//去左右空格;
function trim(s){
  return s.replace(/(^\s*)|(\s*$)/g, "");
}

//最下面一定要加上你自定义的方法(作用:将模块接口暴露出来),否则会报错:util.trim is not a function;
module.exports = {
IsChinese: IsChinese,
trim: trim
}
//test.js

var util = require('../../utils/util.js');
Page({
  onLoad: function () {
  console.log("判断是否为中文:"+util.IsChinese('测试'));
  console.log("去除左右空格:" + util.trim(s));
  }
})

在开发者工具的 Console可以看到

微信小程序如何引用公共js里的方法

注意了,在util.js里的 Regular()方法,我们不可以这样调用util.Regular(),因为我们没有用 module.exports 来暴露模块接口

如果直接 调用则会出现这样的错误

thirdScriptError
util.Regular is not a function;at "pages/test/test" page lifeCycleMethod onLoad function
TypeError: util.Regular is not a function

关于“微信小程序如何引用公共js里的方法”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

--结束END--

本文标题: 微信小程序如何引用公共js里的方法

本文链接: https://lsjlt.com/news/70605.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 微信小程序如何引用公共js里的方法
    这篇文章将为大家详细讲解有关微信小程序如何引用公共js里的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。微信小程序引用公共js里的方法的实例详解一个小程序页面由四个文...
    99+
    2024-04-02
  • 微信小程序如何引用其他js文件
    这篇文章主要介绍了微信小程序如何引用其他js文件,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。微信小程序如何引用其他js文件1.我们先建立一...
    99+
    2024-04-02
  • 【小程序】微信小程序如何获取微信公众号openid?
    一图总览 大家可以先看看下面的流程图,来了解笔者想实现的功能,简单来说就是两个不同主体间的小程序与公众号该如何产生关联。 注:为什么这里要强调不同主体呢,因为同主体的小程序与公众号是可以通过unionId来进行关联绑定。 ...
    99+
    2023-08-19
    微信小程序 小程序 微信
  • 微信公众号跳转小程序方法
    1 公众号需要关联小程序 2 跳转方法:       wx.navigateToMiniProgram(Object object)  打开另一个小程序 wx.navigateToMiniProgram({ appId: '', //...
    99+
    2023-10-23
    小程序 微信 微信小程序
  • 微信小程序如何实现数据共享与方法共享详解
    目录全局数据共享 Moboxnpm安装及其注意事项小程序对 npm 的支持与限制npm 依赖包的安装与使用Mobox组件方法共享 behaviors1. 什么是 behaviors2...
    99+
    2024-04-02
  • 【小程序】微信 JS-SDK的使用:
    文章目录 一、配置JS安全域名二、服务接入三、引入Js文件四、使用wx.config进行权限验证五、案例六、JS-SDK配置流程(后端需要做的)【1】获取access_token【2】获取js...
    99+
    2023-08-31
    微信 javascript 小程序
  • 微信公众号菜单如何配置微信小程序
    这篇文章给大家分享的是有关微信公众号菜单如何配置微信小程序的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。先提条件是你的公众号版定了小程序第一种:直接配置   ...
    99+
    2024-04-02
  • 微信小程序如何推广引流
    给微信小程序做推广引流的方法:1.广告宣传推广,地铁广告;2.名片推广,大型活动;3.自媒体推广,微博、头条、抖音、知乎;4.社群推广,微信社群;具体方法如下:广告宣传推广不管是线上的还是线下的广告,都会有很大的曝光度,类似于地铁广告,地铁...
    99+
    2024-04-02
  • 微信小程序中如何调用scale方法
    这篇文章主要介绍“微信小程序中如何调用scale方法”,在日常操作中,相信很多人在微信小程序中如何调用scale方法问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”微信小程序中如何调用scale方法”的疑惑有所...
    99+
    2023-06-26
  • 微信小程序中引入echart图表的方法
    这篇文章给大家分享的是有关微信小程序中引入echart图表的方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。正文:准备:小程序开发环境,下载ECharts组件,gitHub地址:https://github.c...
    99+
    2023-06-08
  • 微信小程序如何使用其他页面的js
    微信小程序使用其他页面js的案例:封装独立公共js。//common.js 封装的函数function queryExp(result) {  wx.request({  ...
    99+
    2024-04-02
  • 如何选择可靠的微信小程序公司
    小编给大家分享一下如何选择可靠的微信小程序公司,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一,成功的案例在基本了解公司之后,如果您想进一步了解公司的整体水平,还...
    99+
    2023-06-27
  • 微信小程序中如何使用store数据共享
    全局数据共享 全局数据共享(状态管理)是为了解决组件之间数据共享的问题,开发中常用的全局数据共享方案有:Vuex、Redux、MobX等 在小程序中,可用 mobx-miniprog...
    99+
    2023-05-15
    小程序store数据共享 小程序数据共享
  • 微信小程序怎么实现数据共享与方法共享
    微信小程序怎么实现数据共享与方法共享,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。全局数据共享 Mobox原生小程序开发中我们可以通过 mobx-miniprogram 配...
    99+
    2023-06-26
  • 如何在微信小程序中使用Echarts方法
    如何在微信小程序中使用Echarts方法?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。xxx.json{ "usingComponents":...
    99+
    2023-06-08
  • 微信小程序如何引用其他页面的css
    这篇文章主要讲解了“微信小程序如何引用其他页面的css”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“微信小程序如何引用其他页面的css”吧!在wxss中导入外部样式@import ...
    99+
    2023-07-04
  • 微信小程序如何跳转到微信公众号文章,小程序如何关联公众号或订阅号
    微信小程序如何跳转到微信公众号文章,小程序如何关联公众号或订阅号 前置条件 公众号最高管理权限(或能与最高权限管理者配合操作)小程序开发权限或最高管理权限 小程序方面 根据官方资料描述,小程序中展示微...
    99+
    2023-09-18
    小程序 微信小程序 微信 uni-app
  • 微信小程序如何提取公用函数到util.js
    这篇文章主要介绍微信小程序如何提取公用函数到util.js,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!具体如下:在小程序中,定义了一项工具文件utils,此文件的js旨在本文件之内...
    99+
    2024-04-02
  • 微信小程序如何引用视图template模板
    这篇文章将为大家详细讲解有关微信小程序如何引用视图template模板,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。微信小程序视图template模板引用的实例详解WXM...
    99+
    2024-04-02
  • 小程序接入微信公众号方法是什么
    这篇文章主要介绍了小程序接入微信公众号方法是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。公众号关联小程序商家借助得有店创建过小程序之后,企业可以登录公众号后台(企业如果...
    99+
    2023-06-27
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作