【vue，unapi】UniApp引入全局js实现全局方法，全局变量

创建一个全局文件utils.js

export const baseUrl = "https://www.baidu.com/"


export const fn = () => {
	console.log("demo");
}
export const obj ={
	baseUrl : "https://www.baidu.com/",
	demo(){
		console.log("demo2");
	}
}
1
2
3
4
5
6
7
8
9
10
11
12
13

第一种：需要使用变量时需要import导入即可使用。

直接在vue页面中使用

<template>
	<view class="page_content">
	
	</view>
</template>

<script>
	import * as utils from '@/static/js/utils.js';
	export default {
		data() {
			return {
			}
		},
		onLoad() {
			console.log(utils);
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>

</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

第二种：使用Vue.prototype挂载，直接使用this调用

第一步：在main.js中进行挂载

// 导入全局js
import * as utils2 from '@/static/js/utils.js';
Vue.prototype.$utils = utils;

1
2
3
4
5

第二步：在vue页面使用，注意：页面中不要在出现重复的属性或方法名。

// 导入全局js
<template>
	<view class="page_content">

	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad() {
			console.log(this.$utils.);
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>

</style>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28