首先了解全局混入的概念,对于全局引入变量已经非常熟悉,使用全局挂载的方式即可,但是对于多个页面编写同一个方法的情况下,就可以采用全局混入的方式,避免在每个页面都编写同样的方法。
以uniapp微信小程序分享和转发为例:
1、新建混入的js文件:share.js
export default {
data() {
return {
// 混入的数据
globalData:""
};
},
methods: {
// 混入的方法
globalMethod() {
console.log('这是全局方法');
}
},
// 其他选项如生命周期钩子等
onShareAppMessage(){
return {
title: '分享时的标题,一般是小程序名', //分享的标题
path: 'pages/index', //点击分享链接之后进入的页面路径
imageUrl: '/static/index.png' //分享发送的链接图片地址
};
},
onShareTimeline(){
return{
title: '分享时的标题,一般是小程序名', //分享的标题
query: 'pages/index', //点击分享链接之后进入的页面路径
imageUrl: '/static/index.png' //分享发送的链接图片地址
}
}
};
2、在APP.vue或者main.js文件全局引入
import share from './utils/share.js'
//全局挂载变量
app.config.globalProperties.$globalData = globalData;
//全局混入js
app.mixin(share) //注意此处不能使用Vue.mixin(share)
3、这样相当于每个vue文件里面都含有onShareAppMessage()、onShareAppMessage()和globalMethod()
4、uniapp微信小程序的分享功能目前不需要在mainfest.json中打开配置权限,如果需要的话,在mainfest.json的APP模块配置中勾选share模块,并在代码视图中编写:
"sdkConfigs" : {
"share" : {
"weixin" : {
"appid" : "wxf34d21e0ab620e72",
"UniversalLinks" : ""
}
}
},
5、Vue 的全局混入和全局挂载方法有所不同:
全局混入 (Vue.mixin,在uniapp中替换成app.minxin
) 允许你定义一段可以影响所有Vue实例的混入 (mixin) 逻辑。当你使用Vue.mixin定义一段逻辑后,所有之后创建的Vue实例都会接收这段混入的代码。
全局挂载 (Vue.prototype,在uniapp中替换成app.config.globalProperties
) 则是在全局Vue对象上定义一个可以在所有Vue实例中访问的属性或方法。这意味着你可以在任何Vue实例中直接使用这个全局属性或方法,就像使用本地定义的实例方法一样。
所以当需要在vue文件中加入全局方法且不需要调用时使用全局混入,当需要调用全局方法时使用全局挂载。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具
2019-10-12 maven管理工具配置