判断View是否显示在界面上

文章介绍了一个项目中遇到的问题:如何让不在ViewController层级内的View自行判断其状态变化,如被遮挡或显示。通过研究view的`willMoveToWindow:`和`willMoveToSuperview:`方法,作者提出了一种解决策略。尽管这种方法非正统,但在特定情况下提供了实用的解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

我们都知道ViewController有viewWillAppear和viewDidAppear等关于页面生命周期的方法,用来对视图做一些管理,比如页面出现时怎么样,页面消失时怎么样。。

但是对于View,有没有类似的方法可以判断是否view出现了,view消失或者被遮挡了呢?


先介绍一下场景吧,朋友的一个项目,有个界面是直接做了个View,然后add到某个ViewController上去了(层级比较深,不方便在ViewController里操作这个view)。后来需求变动,需要这个View中做一些判断,该界面被其他vc遮挡后,再返回来时需要刷新这个view。
正常的做法是通过vc来控制这个view,但是这次由于时间紧迫,项目也不方便改动,于是需要这个view自己实现相应处理。

上解决方案:
对于view来说,有两个关于自身页面状态的方法

-(void)willMoveToWindow:(UIWindow *)newWindow
- (void)willMoveToSuperview:(UIView *)newSuperview

如何利用这些方法呢,经过测试

-(void)willMoveToWindow:(UIWindow *)newWindow

这方法在页面被添加到视图时会调用,且newWindow是存在的。
当有新的vc遮挡时,这方法也会被调用(连续调用了两次,原因有待查明),但是newWindow是nil,利用这一点,可以简单判断页面的状态。

最后要重申一点,这种方法并非开发的正道,正确做法仍然是通过VC来管理页面。

### Vue Router 实现 `router-view` 固定界面不刷新解决方案 为了使特定的组件在导航时不被销毁并保持其状态,可以利用 `<keep-alive>` 和路由元信息来控制哪些页面应该被缓存。 #### 使用场景描述 当希望某些页面在切换时不会重新加载数据或重置表单等操作,则可以通过配置这些页面对应的路由对象中的 meta 字段指定是否启用缓存功能。对于不需要缓存的内容则正常渲染即可[^3]。 #### 修改 App.vue 文件结构如下: ```html <template> <div id="app"> <!-- 头部或其他公共部分 --> <!-- 缓存需要保存状态的视图 --> <keep-alive> <router-view v-if="$route.meta.isKeepAlive"></router-view> </keep-alive> <!-- 非缓存视图直接展示 --> <router-view v-if="!$route.meta.isKeepAlive"></router-view> </div> </template> ``` 此模板通过判断 `$route.meta.isKeepAlive` 的布尔值决定当前访问的组件是否应用 `<keep-alive>` 进行缓存处理。 #### 路由定义中设置 Meta 属性 为了让上述逻辑生效,在创建路由实例的时候就需要为那些想要保留状态的页面添加额外属性 `meta:{isKeepAlive:true}` 。例如: ```javascript const routes = [ { path: '/', name: 'Home', component: Home, meta: { isKeepAlive: true } // 设置首页会被缓存 }, { path: '/about', name: 'About', component: About, meta: { isKeepAlive: false } // 关闭关于页的缓存 } ]; ``` 这样就可以灵活地管理各个页面的状态持久化需求了。 另外需要注意的是,如果遇到 `[Vue Router warn]: <router-view can no longer be used directly inside <transition or <keep-alive>. Use slot props instead:` 类似的警告信息,这表明新版 Vue Router 中已经不再支持将 `<router-view>` 直接放置于 `<transition>` 或者 `<keep-alive>` 标签内作为子元素的方式;此时应当采用具名插槽的形式来进行嵌套布局设计[^1]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值