玩转动态组件、插槽和自定义指令
最编程
2024-02-03 13:55:06
...
<template>
<div class="app-container">
<h1>App 根组件</h1>
<hr/>
<button @click="comName='Left'">展示left</button>
<button @click=" comName='Right'">展示Right</button>
<div class="box">
<!-- 可以把内部的组件进行缓存，保证组件不会被销毁掉 -->
<!-- include="Left"属性只要在include属性中都会被缓存-->
<keep-alive include="Left,Right">
<!-- comNameponent标签占位符 动态绑定is属性的指定值 -->
<component :is="comName" ></component>
</keep-alive>
</div>
</div>
</template>
<script>
import Left from "@/components/Left.vue";
import Right from "@/components/Right.vue";
export default {
data() {
return {
// comName 表示要展示的组件的名字
comName: "Left",
};
},
components: {
Left,
Right
},
//当组件第一次被创建的时候，会执行c'reated生命周期和activated的生命周期
//当组件被激活的时候，只会出发activated生命周期不会触发created，因为组件没有被创建
activated(){
},
deactivated(){
}
};
</script>
推荐阅读
-
用于 Goldmap 组件的动态标记和自定义弹出框，交互事件，中心点跳转
-
假大众点评 - 如何使用 Vant Framework 通过插槽槽使用 Tab Tabs 和 NavBar 导航栏自定义两个导航组件
-
玩转Java底层：JMX详解 - jconsole与自定义MBean监控工具的实际应用与区别" 在日常JVM调优中，我们熟知的jconsole工具通过JMX包装的bean以图形化形式展示管理数据，而像jstat和jmap这类内建监控工具则由JVM直接支持。本文将以jconsole为例，深入讲解其实质——基于JMX的MBean功能，包括可视化界面上的bean属性查看和操作调用。 MBeans在jconsole中的体现是那些可观察的组件属性和方法，如上图所示，通过名为"Verbose"的属性能看到其值为false，同时还能直接操作该bean的方法，例如"closeJerryMBean"。 尽管jconsole给我们提供了直观的可视化界面，但请注意，这里的MBean并非固定不变，开发者可根据JMX提供的接口将自己的自定义bean展示到jconsole。以下步骤展示了如何创建并注册一个名为"StudyJavaMBean"的自定义MBean： 1. 首先定义接口`StudyJavaMBean`，接口需遵循MBean规范，即后缀为"MBean"且包含getter方法代表属性，如`getApplicationName`，和无返回值的setter方法代表操作，如`closeJerryMBean`。 ```java public interface StudyJavaMBean { String getApplicationName(); void closeJerryMBean(); } ``` 2. 编写接口的实现类`StudyJavaMBeanImpl`，实现接口中的方法： ```java public class StudyJavaMBeanImpl implements StudyJavaMBean { @Override public String getApplicationName() { return "每天学Java"; } @Override public void closeJerryMBean() { System.out.println("关闭Jerry应用"); } } ``` 3. 在代码中注册自定义MBean，涉及的关键步骤包括： - 获取平台MBeanServer - 定义ObjectName，指定唯一的MBean标识符 - 注册MBean到服务器 - 启动RMI连接器服务，以便jconsole能够访问 ```java public void registerMBean() throws Exception { // ... 具体实现省略 ... } ``` 实际运行注册后的MBean，您将在jconsole中发现并查看自定义bean的属性和调用相关方法。然而，这种方式相较于传统的属性/日志查看和HTTP接口，实用性相对有限，可能存在潜在的安全风险。但不可否认的是，JMX及其MBean机制对于获取操作系统信息、内存状态等关键性能指标仍然具有重要价值。例如： 1. **获取操作系统信息**：通过JMX MBean，可以直接获取到诸如CPU使用率、操作系统版本等系统级信息，这对于资源管理和优化工作具有显著帮助。
-
玩转动态组件、插槽和自定义指令
-
深入理解Vue2和3：第13课插槽机制详解和自定义组件实例演示
-
玩转Vue3组件：详解组件的构造、参数与事件，深入理解 Slots 和动态组件