uniapp -- 调用其他js

步骤

  1. 保证要引入的js是模块化的
  2. export default 模块导出
    import XXX from ‘./common/XXX.js’
  3. export 模块导出
    import {XXX} from ‘./common/XXX.js’
  4. commonjs、adm、cmd模块

模块化是什么

把系统分离成独立功能的方法,需要什么功能就加载什么功能
相互独立+可重复使用

ES6模块 – 用于浏览器环境【export+import】

1. 定义模块 – 输出模块

export default {name: 'XXX'}
//
export let name = 'XX'
export let sayName = () => console.log(name);

2. 使用模块 – require引入依赖

import people from 'XXX'
console.log(people)

//
 
import * as people from  'XXX';
console.log(people)

import {name, sayName} from 'XXX'

commonJs – 用于Node环境

1. 定义模块

**// 定义变量和方法**
// 变量
let name = 'XX'
// 方法
let sayName = function() {
};
**// 定义导出**
// 方法一: -- 可以返回一个数据类型(String,Number,Object)
module.exports = {name, sayName}
// 方法二: - 只能返回Object对象 -- 给export添加属性和方法
exports.sayName = sayName;

2. 加载模块

// require 引入依赖
let module = require('./module.js');
module.sayName()

AMD – 用于浏览器环境(异步加载模块)【define定义,require加载】

1. 定义模块

define(['module'], function() {
	// 定义变量
	let name = 'XXX'
	// 定义方法
	let sayName() {
	}

	return { sayName }
})

2. 使用模块 – require引入依赖

require(['module'], function(mod) {
	mod.sayName();
})

CMD – 用于浏览器环境(异步加载模块)【define定义,require加载】

1. 定义模块

define(['module'], function() {
	// 定义变量
	let name = 'XXX'
	// 定义方法
	let sayName() {
	}

	return { sayName }
})

2. 使用模块 – require引入依赖

define(function(require, exports, module) {
	// 通过require 引入依赖
	var otherModule = require('./otherModule');
	// 通过exports对外提供接口
	exports.myModule = function() {};
	// 或者通过 module.exports 提供整个接口
	module.export = function() {}
 }

你可能感兴趣的:(uni-app,前端学习)