微信小程序提取公用函数到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 相关文章推荐
面向对象的编程思想在javascript中的运用上部
Nov 20 Javascript
JavaScript 继承机制的实现(待续)
May 18 Javascript
jquery一般方法介绍 入门参考
Jun 21 Javascript
使用javascript为网页增加夜间模式
Jan 26 Javascript
js实现浏览器窗口大小被改变时触发事件的方法
Feb 02 Javascript
AngularJS中过滤器的使用与自定义实例代码
Sep 17 Javascript
微信小程序加载更多 点击查看更多
Nov 29 Javascript
利用vue实现模态框组件
Dec 19 Javascript
Javascript实现页面滚动时导航智能定位
May 06 Javascript
简单实现js拖拽效果
Jul 25 Javascript
解决vue中使用Axios调用接口时出现的ie数据处理问题
Aug 13 Javascript
一步一步实现Vue的响应式(对象观测)
Sep 02 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
php zend 相对路径问题
2009/01/12 PHP
PHP下通过file_get_contents的代理使用方法
2011/02/16 PHP
关于Iframe如何跨域访问Cookie和Session的解决方法
2013/04/15 PHP
PHP把网页保存为word文件的三种方法
2014/04/01 PHP
PHP中数据类型转换的三种方式
2015/04/02 PHP
Android App中DrawerLayout抽屉效果的菜单编写实例
2016/03/21 PHP
基于PHP实现堆排序原理及实例详解
2020/06/19 PHP
extjs4 treepanel动态改变行高度示例
2013/12/17 Javascript
仿淘宝TAB切换搜索框搜索切换的相关内容
2014/09/21 Javascript
每天一篇javascript学习小结(RegExp对象)
2015/11/17 Javascript
详解JavaScript数组和字符串中去除重复值的方法
2016/03/07 Javascript
AngularJS实现与Java Web服务器交互操作示例【附demo源码下载】
2016/11/02 Javascript
面包屑导航详解
2017/12/07 Javascript
详解webpack 最简打包结果分析
2019/02/20 Javascript
Vue移动端用淘宝弹性布局lib-flexible插件做适配的方法
2020/05/26 Javascript
[01:35]辉夜杯战队访谈宣传片—LGD
2015/12/25 DOTA
Python基础教程之tcp socket编程详解及简单实例
2017/02/23 Python
python正则表达式的使用
2017/06/12 Python
解决python通过cx_Oracle模块连接Oracle乱码的问题
2018/10/18 Python
python中的tcp示例详解
2018/12/09 Python
Python+selenium点击网页上指定坐标的实例
2019/07/05 Python
Python如何使用BeautifulSoup爬取网页信息
2019/11/26 Python
浅谈django 重载str 方法
2020/05/19 Python
Python爬虫设置ip代理过程解析
2020/07/20 Python
html5中使用hotcss.js实现手机端自适配的方法
2020/04/23 HTML / CSS
巴西宠物商店:Cobasi
2019/04/19 全球购物
巴西Mr. Cat在线商店:购买包包和鞋子
2019/09/08 全球购物
Myprotein西班牙官网:欧洲第一大运动营养品牌
2020/02/24 全球购物
美国床垫连锁店:Mattress Firm
2021/02/13 全球购物
经济系大学生求职信
2013/10/01 职场文书
个人授权委托书范本
2014/09/14 职场文书
领导班子民主生活会整改措施(工商局)
2014/09/21 职场文书
2014光棍节单身联谊活动策划书
2014/10/10 职场文书
怎么写工作检讨书
2014/11/16 职场文书
2015驻村干部工作总结
2015/04/07 职场文书
彻底卸载VMware虚拟机的超详细步骤记录
2022/07/15 Servers