微信小程序提取公用函数到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 相关文章推荐
浅析JQuery UI Dialog的样式设置问题
Dec 18 Javascript
javascript刷新父页面的各种方法汇总
Sep 03 Javascript
jquery实现点击label的同时触发文本框点击事件的方法
Jun 05 Javascript
JavaScript各类型的关系图解
Oct 16 Javascript
jQuery动画_动力节点节点Java学院整理
Jul 04 jQuery
node实现简单的反向代理服务器
Jul 26 Javascript
vue添加axios,并且指定baseurl的方法
Sep 19 Javascript
JS原型与继承操作示例
May 09 Javascript
小程序登录/注册页面设计的实现代码
May 24 Javascript
JS数组方法join()用法实例分析
Jan 18 Javascript
vue 虚拟DOM的原理
Oct 03 Javascript
原生js实现表格循环滚动
Nov 24 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出错界面
2006/10/09 PHP
一个没有MYSQL数据库支持的简易留言本的编写
2006/10/09 PHP
PHPThumb图片处理实例
2014/05/03 PHP
php使用百度ping服务代码实例
2014/06/19 PHP
Laravel中使用阿里云OSS Composer包分享
2015/02/10 PHP
使用ltrace工具跟踪PHP库函数调用的方法
2016/04/25 PHP
PHP实现的登录,注册及密码修改功能分析
2016/11/25 PHP
关于php支持的协议与封装协议总结(推荐)
2017/11/17 PHP
php常用经典函数集锦【数组、字符串、栈、队列、排序等】
2019/08/23 PHP
JS 密码强度验证(兼容IE,火狐,谷歌)
2010/03/15 Javascript
基于jquery的cookie的用法
2011/01/10 Javascript
谈谈JavaScript类型系统之Math
2016/01/06 Javascript
jquery实现网站列表切换效果的2种方法
2016/08/12 Javascript
js判断文件格式及大小的简单实例(必看)
2016/10/11 Javascript
微信小程序 石头剪刀布实例代码
2017/01/04 Javascript
AngularJS动态绑定ng-options的ng-model实例代码
2017/06/21 Javascript
JS库之wow.js使用方法
2017/09/14 Javascript
基于Vuex无法观察到值变化的解决方法
2018/03/01 Javascript
vue.js打包之后可能会遇到的坑!
2018/06/03 Javascript
python结合selenium获取XX省交通违章数据的实现思路及代码
2016/06/26 Python
IntelliJ IDEA安装运行python插件方法
2018/12/10 Python
使用Python将Mysql的查询数据导出到文件的方法
2019/02/25 Python
浅谈Pytorch torch.optim优化器个性化的使用
2020/02/20 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
Python DES加密实现原理及实例解析
2020/07/17 Python
使用CSS3来代替JS实现交互
2017/08/10 HTML / CSS
Java里面有没有全局变量?为什么?
2015/02/06 面试题
在职人员函授期间自我评价分享
2013/11/08 职场文书
仓库管理专业个人的自我评价
2013/12/30 职场文书
施工资料员岗位职责
2014/01/06 职场文书
干部个人考察材料
2014/12/24 职场文书
活动总结书怎么写
2015/05/11 职场文书
法定代表人身份证明书
2015/06/18 职场文书
2019年度行政文员工作计划范本!
2019/07/04 职场文书
Python - 10行代码集2000张美女图
2021/05/23 Python
使用pandas生成/读取csv文件的方法实例
2021/07/09 Python