vue 如何实现全局登录组件?

2020-06-06 14:11:39 +08:00
 zarte

想实现的功能是:

任意界面
if (this.checklogin()){
...
}

checklogin 为全局方法

checklogin(){
//未登录弹出登录弹窗
return false
}

通过 vue 。install 可以实现全局登录判断方法。但是登录弹窗组件不知道要怎么弄。

3283 次点击
所在节点    Vue.js
8 条回复
ljpCN
2020-06-06 14:49:28 +08:00
根组件放个 modal,vuex 里搞个全局 state 控制 modal 的显示与否
sixway
2020-06-06 15:33:38 +08:00
zarte
2020-06-06 15:35:00 +08:00
@ljpCN 恩目前通过这样弄出来了。有个问题为啥通过全局变量的方式无法控制 ant design 的弹窗显示与隐藏,需要通过 vuex 的才行?
lybcyd
2020-06-06 17:48:57 +08:00
在 layout 组件里放一个登录弹窗呗。全局变量不是被 vue 监听的变量,无法触发 vue 的响应式机制,所以不能控制弹窗。
ljpCN
2020-06-06 19:18:50 +08:00
@zarte 用 js 的普通变量做不到数据变化视图自动响应。vuex 能做到是因为它监听了数据的变化,自动触发了对视图的修改。建议阅读 vue 官方文档关于数据绑定视图的部分。
当然我不确定你用 mixin 为每个组件混入一个 data 来控制弹窗的显隐会不会有效果。
toesbieya
2020-06-06 19:59:49 +08:00
https://github.com/ElemeFE/element/blob/dev/packages/message/src/main.js
element-ui 的 message 源码,动态创建组件动态插入 dom,最好的方式
catch
2020-06-07 12:54:06 +08:00
基础差的可怕,你是在自学吗?
zarte
2020-06-08 08:59:53 +08:00
@catch 不知道怎么补基础?现在是用别人弄好的 ant vue pro 直接改。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/679163

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX