微信小程序提取公用函数到util.js及使用方法示例


Posted in Javascript onJanuary 10, 2019

本文实例讲述了微信小程序提取公用函数到util.js及使用方法。分享给大家供大家参考,具体如下:

在小程序中,定义了一项工具文件utils,此文件的js旨在本文件之内有效,当其他子页面想调用其中的js方法或者变量时,需要两步骤:

1:在utils被调用的js文件中,面向对象的方式模型输出:

module.exports={要调用的函数名称:要调用的函数名称 };

2:在要调用的js文件中模块化引入utils的js文件

var object=require("utils被调用的js文件地址")

可以输出一下object就能看到被调用的方法了;

例子如下:

utils中被调用的js:

var URl='http://123.23.169';
 var getImageurl=function(imageurl){
  return URl+imageurl;
 }
 // 要引用这个文件的函数或者变量,除了在要引用的的js文件中模块化之外(var utils=require('js地址')),
 // 在被引用的的js中要通过 module.exports={a:a}作为面向对象的变量输出函数如下:
 module.exports={
  URl:URl,//要引用的函数 xx:xx
  getImageurl:getImageurl
}

要调用的js文件:

// 获得工具utils工具js里面函数,先模块化引用utils里面的js地址 reqiure('js地址')成一个面向对象
var utils=require('../../utils/app.js')
// console.log(utils) 可查看获得的函数
console.log(utils.getImageurl('iamgeaaddress.png'))

输出结果:

微信小程序提取公用函数到util.js及使用方法示例

补充:工具库的创建与使用

创建一个common文件夹

在common文件夹中创建一个utils文件夹

在utils文件夹中创建util.js

// 工具
function tool() {
  console.log('i am a tool function.');
}
module.exports = {
  tool: tool
}

在具体的页面js中调用

首先要引入工具文件

const util = require('../../common/utils/util');

然后在具体的位置使用即可。

onLoad: function (options) {
  util.tool();
  ...
}

i am a tool function.

这有点像,php中的common.php,里面有很多通用的函数库。其实,不论是前端,还是后端。一些思想都是相通的。

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
Prototype 工具函数 学习
Jul 23 Javascript
javascript 基础篇4 window对象,DOM
Mar 14 Javascript
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
jQuery显示和隐藏 常用的状态判断方法
Jan 29 Javascript
jquery使用animate方法实现控制元素移动
Mar 27 Javascript
node.js中格式化数字增加千位符的几种方法
Jul 03 Javascript
JavaScript用二分法查找数据的实例代码
Jun 17 Javascript
vue引入js数字小键盘的实现代码
May 14 Javascript
解决Mac安装thrift因bison报错的问题
May 17 Javascript
微信小程序多音频播放进度条问题
Aug 28 Javascript
JS滚轮控制图片缩放大小和拖动的实例代码
Nov 20 Javascript
JS加载解析Markdown文档过程详解
May 19 Javascript
浅谈JavaScript 代码简洁之道
Jan 09 #Javascript
react组件从搭建脚手架到在npm发布的步骤实现
Jan 09 #Javascript
微信小程序公用参数与公用方法用法示例
Jan 09 #Javascript
微信小程序实现的日期午别医生排班表功能示例
Jan 09 #Javascript
Windows下Node爬虫神器Puppeteer安装记
Jan 09 #Javascript
jQuery简单实现根据日期计算星期几的方法
Jan 09 #jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 #jQuery
You might like
追求程序速度,而不是编程的速度
2008/04/23 PHP
php数组函数序列之in_array() - 查找数组中是否存在指定值
2011/11/07 PHP
php根据用户名和手机号查询是否存在手机号码
2017/02/16 PHP
php 中的信号处理操作实例详解
2020/03/04 PHP
漂亮的widgets,支持换肤和后期开发新皮肤
2007/04/23 Javascript
使用javascript实现页面定时跳转总结篇
2013/09/21 Javascript
JavaScript怎么判断图片是否加载完成以便获取其尺寸
2014/05/08 Javascript
jquery实现未经美化的简洁TAB菜单效果
2015/08/28 Javascript
Sublime Text 3常用插件及安装方法
2015/12/16 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
2016/06/05 Javascript
解析JavaScript实现DDoS攻击原理与保护措施
2016/12/26 Javascript
一个简易时钟效果js实现代码
2020/03/25 Javascript
JS交互点击WKWebView中的图片实现预览效果
2018/01/05 Javascript
利用Console来Debug的10个高级技巧汇总
2018/03/26 Javascript
NodeJs项目中关闭ESLint的方法
2018/08/09 NodeJs
浅谈微信JS-SDK 微信分享接口开发(介绍版)
2018/08/15 Javascript
详解JS中统计函数执行次数与执行时间
2018/09/04 Javascript
可能被忽略的一些JavaScript数组方法细节
2019/02/28 Javascript
JavaScript交换两个变量方法实例
2019/11/25 Javascript
原生JS实现京东查看商品点击放大
2020/12/21 Javascript
[54:19]完美世界DOTA2联赛PWL S2 Magma vs PXG 第二场 11.28
2020/12/01 DOTA
在Python中处理字符串之isdecimal()方法的使用
2015/05/20 Python
深入浅析Python中join 和 split详解(推荐)
2016/06/30 Python
基于Python对数据shape的常见操作详解
2018/12/25 Python
python调用matlab的m自定义函数方法
2019/02/18 Python
浅谈keras中loss与val_loss的关系
2020/06/22 Python
HTML最新标准HTML5总结(必看)
2016/06/13 HTML / CSS
CAT鞋英国官网:坚固耐用的靴子和鞋
2016/10/21 全球购物
手工制作的意大利礼服鞋:Ace Marks
2018/12/15 全球购物
在阿尔卑斯山或希腊度过快乐假期:Alpine Elements
2019/12/28 全球购物
描述内存分配方式以及它们的区别
2016/10/15 面试题
文秘自荐信
2013/10/20 职场文书
运动会口号8字
2014/06/07 职场文书
学校联谊协议书
2014/09/16 职场文书
领导干部群众路线对照检查材料
2014/11/05 职场文书
ConstraintValidator类如何实现自定义注解校验前端传参
2021/06/18 Java/Android