微信小程序提取公用函数到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.js进行异步操作
Feb 07 Javascript
用JavaScrpt实现文件夹简单轻松加密的实现方法图文
Sep 08 Javascript
jquery插件珍藏(图片局部放大/信息提示框)
Jan 08 Javascript
js实现幻灯片播放图片示例代码
Nov 07 Javascript
js获取select选中的option的text示例代码
Dec 19 Javascript
js中switch case循环实例代码
Dec 30 Javascript
js使用split函数按照多个字符对字符串进行分割的方法
Mar 20 Javascript
js实现的简单图片浮动效果完整实例
May 10 Javascript
JavaScript cookie详解及简单实例应用
Dec 31 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
Jan 20 Javascript
javascript实现导航栏分页效果
Jun 27 Javascript
解决VUE双向绑定失效的问题
Oct 29 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
收音机玩机评测 406 篇视频合集
2020/03/11 无线电
php下用GD生成生成缩略图的两个选择和区别
2007/04/17 PHP
php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE
2009/10/15 PHP
探讨:parse url解析URL,返回其组成部分
2013/06/14 PHP
浅析php中常量,变量的作用域和生存周期
2013/08/10 PHP
Smarty最简单实现列表奇偶变色的方法
2015/07/01 PHP
eclipse php wamp配置教程
2016/06/30 PHP
如何修改yii2.0自带的user表为其它的表
2017/08/01 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
JS Map 和 List 的简单实现代码
2013/07/08 Javascript
jquery移除、绑定、触发元素事件使用示例详解
2014/04/10 Javascript
js 获取input点选按钮的值的方法
2014/04/14 Javascript
jQuery实现强制cookie过期方法汇总
2015/05/22 Javascript
快速学习JavaScript的6个思维技巧
2015/10/13 Javascript
Bootstrap3制作搜索框样式的方法
2016/07/11 Javascript
AngularJs点击状态值改变背景色的实例
2017/12/18 Javascript
Angular 开发学习之Angular CLI的安装使用
2017/12/31 Javascript
JavaScript面试出现频繁的一些易错点整理
2018/03/29 Javascript
vue使用el-upload上传文件及Feign服务间传递文件的方法
2019/03/15 Javascript
jquery向后台提交数组的代码分析
2020/02/20 jQuery
构建一个JavaScript插件系统
2020/10/20 Javascript
在Python中通过threading模块定义和调用线程的方法
2016/07/12 Python
python实时分析日志的一个小脚本分享
2017/05/07 Python
Vue的el-scrollbar实现自定义滚动
2018/05/29 Python
Django中的静态文件管理过程解析
2019/08/01 Python
如何在Cloud Studio上执行Python代码?
2019/08/09 Python
TensorFlow设置日志级别的几种方式小结
2020/02/04 Python
使用 Python ssh 远程登陆服务器的最佳方案
2020/03/06 Python
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
Bibloo荷兰:女士、男士和儿童的服装、鞋子和配饰
2019/02/25 全球购物
公司部门司机岗位职责
2014/01/03 职场文书
数控专业大学毕业生职业规划范文
2014/02/06 职场文书
婚前协议书
2014/04/15 职场文书
防灾减灾日活动总结
2014/08/26 职场文书
医院见习总结
2015/06/24 职场文书
PostgreSQL自动更新时间戳实例代码
2021/11/27 PostgreSQL