Ersonnnn 2021-05-17 20:42 采纳率: 0%
浏览 94

v-show条件渲染多个父组件,子组件触发父组件函数会触发到哪一个

问题背景:

1. 多个父组件复用一个子组件,不同条件下要对父组件进行切换(v-if、v-show),称这些父组件为不同属性页。

2. 其它组件有更改时,要对属性页进行更新,要更改的组件与属性页没直接关系,所以设置一个状态管理变量来管理属性页是否更新,并在属性页中进行监听,当其它组件更改时,更改这个变量,从而更新属性页。

3. 监听函数放在子组件中,当变量改变时,子组件触发父组件更新函数,从而对属性页进行更新。

那么,使用 v-if 还是 v-show 对属性页进行条件渲染呢?

  • 在这里先介绍一下 v-if 和 v-show

  - v-if:条件块内的事件监听器和子组件会被销毁和重建。只有初始条件是 true 时才会渲染。

       - v-show:不管初始条件是啥,元素总会被渲染,切换只是简单地基于CSS进行切换。

  • 解决思路描述

  - 频繁的属性页切换适合用v-show。但是如果用 v-show,那么监听子组件触发父组件函数时,无法触发到目前正在show的这个父组件的函数,也无法同时触发多个父组件函数(当然也不想这样做)

  - 使用 v-if 当然可以,但是由于多人开发,有一个属性页它并不能被销毁,不然会报错,所以该属性页必须得用 v-show

  - 对于绑定了 ref 的属性页,也必须要用 v-show 啊,但是只能有一个 v-show(如果有两个就又会出现第一个问题),于是在用到这个组件 ref 的时候,使用 setTimeOut 让它去注册一下。

感觉出这个设计模式并不好,请问有更好的设计方法吗?

  • 写回答

1条回答 默认 最新

  • 有问必答小助手 2021-05-18 10:52
    关注

    你好,我是有问必答小助手,非常抱歉,本次您提出的有问必答问题,目前超出我们的服务范围,暂时无法为您解答。

    首次提问人员可免费体验一次有问必答服务。目前首次提问的问题服务范围为:编程语言、Java开发、python、数据库、前端开发 领域专业技术问题,为您提供问题的解决思路和指导。不提供源码代写、项目文档代写、论文代写、安装包资源发送或安装、软件使用指导等服务。

    我们后续会持续优化,扩大我们的服务范围,为您带来更好地服务。

    评论

报告相同问题?

悬赏问题

  • ¥15 ecology9的待办推送外部系统
  • ¥15 Mplus跑出来的数据只有原数据的一半
  • ¥15 vue项目添加全局处理解决一些开发问题
  • ¥40 微信小程序前后端交互
  • ¥50 数据预处理(大量数据)
  • ¥15 多设备数据融合可视化显示控制
  • ¥15 公众号关键词自动回复超链接
  • ¥18 help me! 希望大家来看看 吉~
  • ¥15 C++显示超限兔子集结
  • ¥15 sql server 2012的下载出错