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

devtools/2024/9/25 11:19:17/

创建一个全局文件utils.js

javascript">
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");}
}

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

直接在vue页面中使用

javascript"><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>

在这里插入图片描述

第二种:使用Vue.prototype挂载,直接使用this调用

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

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

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

javascript">
// 导入全局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>

在这里插入图片描述


http://www.ppmy.cn/devtools/21636.html

相关文章

【Leetcode】33- 搜索旋转排序数组

题目简述 整数数组 nums 按升序排列&#xff0c;数组中的值互不相同。 在传递给函数之前&#xff0c;nums 在预先未知的某个下标 k&#xff08;0 < k < nums.length&#xff09;上进行了旋转&#xff0c;使数组变为 [nums[k], nums[k1], …, nums[n-1], nums[0], nums[1…

房产中介小程序高效开发攻略:从模板到上线一站式服务

对于房产中介而言&#xff0c;拥有一个高效且用户友好的小程序是提升业务、增强客户黏性的关键。而采用直接复制模板的开发方式&#xff0c;无疑是实现这一目标的最佳途径&#xff0c;不仅简单快捷&#xff0c;而且性价比极高。 在众多小程序模板开发平台中&#xff0c;乔拓云网…

Bentley二次开发教程25-工程属性-EC属性操作方法

工程属性操作方法 EC属性操作方法 因为Schema文件导入后没有像ItemType的操作界面&#xff0c;因此若需要了解文件中ECSchema的导入情况&#xff0c;需要使用keyin命令&#xff1a;ecx schema list显示在提示栏中&#xff0c;或使用ecx schema export导出文件查看。 导入Sch…

electron中ipcMain用法

在Electron中&#xff0c;ipcMain模块是一个非常重要的组件&#xff0c;它用于在Electron的主进程&#xff08;main process&#xff09;和渲染进程&#xff08;renderer processes&#xff09;之间进行异步消息通信。ipcMain与ipcRenderer模块一起工作&#xff0c;允许两者之间…

设计模式-行为型模式-责任链模式

使用多个对象都有机会处理请求&#xff0c;从而避免请求的发送者和接收者之间的耦合关系。将这些对象连成一条链&#xff0c;并沿着这条链传递该请求&#xff0c;直到有一个对象处理它为止。 /*** 责任链模式* 类型&#xff1a;行为型* 描述&#xff1a;使用多个对象都有机会处…

Spring基础

一、Spring概述 1、Spring框架 Spring就是一个java框架&#xff0c;使用java语言开发&#xff0c;轻量级的开源框架&#xff0c;可以在j2se&#xff0c;j2ee都可使用。 Spring核心技术&#xff1a;IOC&#xff0c;AOP&#xff0c;核心是控制反转(IOC)和面向切面编程(AOP) S…

k8s pod 无法启动一直ContainerCreating

情况如下&#xff0c;更新 pod 时&#xff0c;一直在ContainerCreating 查看详细信息如下 Failed to create pod sandbox: rpc error: code Unknown desc [failed to set up sandbox container “334d991a478b9640c66c67b46305122d7f0eefc98b2b4e671301f1981d9b9bc6” networ…

Qt 把.exe打包成安装文件形式

目录 1.下载工具 Qt Installer Framework2.将bin文件添加到环境变量3.拷贝startmenu示例-备用4.准备Qt Release打包好的程序5.把Release打包好的程序放到packages\org.qtproject.ifw.example\data文件夹下6.生成安装包7.修改安装包图标8.修改主程序程序安装引导-创建快捷键9.添…