vue3 component is 不显示的问题及解决
更新时间：2024年03月15日 09:31:55 作者：MAIMIHO
这篇文章主要介绍了vue3 component is 不显示的问题及解决,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue3 component is 不显示
原因
通过名称传递必须先对其进行注册, 将组件本身传递给 is 而不是其名称，则不需要注册
<script>
import { Transition, TransitionGroup } from 'vue'
export default {
components: {
Transition,
TransitionGroup
}
}
</script>
<template>
<component :is="isGroup ? 'TransitionGroup' : 'Transition'">
...
</component>
</template>
setup 写法
<script setup>
import TestOne from './components/TestOne.vue'
import TestTwo from './components/TestTwo.vue'
const tabs = [TestTwo, TestOne];
const title = 'Hello';
</script>
或者
<script setup>
const tabs = [TestTwo, TestOne];
const title = 'Hello';
</script>
<script>
import TestOne from './components/TestOne.vue'
import TestTwo from './components/TestTwo.vue'
export default {
components: {
TestOne,
TestTwo
}
}
</script>
vue动态组件component:is的使用？
vue 动态组件用于实现在指定位置上，动态加载不同的组件，核心代码为：
<component :is="componentTag"></component>
data() {
return {
componentTag: '',
}
}componentTag 为自定义的变量，将需要加载的组件名赋值给它，即可在<component />标签出现的位置，渲染该组件。
这个是vue的组件，is=要渲染的组件，不会更新路由，不会更新初始化函数mounted和created。
刷新页面后会跳回默认显示页面；
缺点
需要引入所有要显示的组件，并且components:{声明}
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
关于vue.extend和vue.component的区别浅析
最近工作中遇到了vue.extend,vue.component，但二者之间的区别与联系是什么呢？下面这篇文章主要给大家介绍了关于vue.extend和vue.component区别的相关资料，需要的朋友可以参考借鉴，下面来一起看看吧。2017-08-08
这篇文章主要介绍了vue实现登录拦截，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-06-06
这篇文章主要为大家介绍了简易vuex4核心原理及实现源码分析，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
这篇文章主要介绍了vue如何点击多个tab标签打开关闭多个页面，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
这篇文章主要介绍了Vue中声明式导航与编程式导航，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧2022-11-11
这篇文章主要给大家介绍了关于vue过滤器filter的使用方法,Vue.js的过滤器(Filter)是一种可重用的功能,用于对文本进行格式化,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了Vue3 实现一个自定义toast 小弹窗,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-09-09
这篇文章主要给大家介绍了关于Vue中常用的鼠标移入移出事件的相关资料,鼠标移入移出事件在 Vue 中可以通过@mouseenter和@mouseleave来绑定,需要的朋友可以参考下2023-07-07
这篇文章主要介绍了vite+vue3+ts项目中提示无法找到模块的问题及解决,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-08-08
这篇文章主要为大家详细介绍了如何使用vue+epubjs实现电子书阅读器的基本功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2023-11-11
最新评论