nuxt3使用自定义组件

说明:nuxt3只有components文件夹里面的页面会自动注册为组件,但是有些单独的页面也需要组件,但是也不是全局的,所以写在pages里面的页面,需要手动注册为组件使用

1.创建组件

pages里面创建页面文件夹,在那个文件夹里面创建一个主页面和一个组件文件夹,名字自定义

2.注册组件

nuxt.config.ts 文件的components缩小里面进行注册

  /** 注册组件 引入组件所在的文件夹 */components: [{ path: '~/pages/courseDetails/components' },{ path: '~/pages/news/components' },{ path: '~/components' },],

3.使用组件

 在页面直接使用,组件的文件名

<Assess v-if="activeName == 'Assess'" />
<Fans v-if="activeName == 'Fans'" />
<PrivateLetter v-if="activeName == 'PrivateLetter'" />
<SystemNotice v-if="activeName == 'SystemNotice'" />

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/568571.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CQBF氟塑料磁力泵

引言&#xff1a; 在当今的工业制造和化学处理领域&#xff0c;对高效率、耐用性和安全性的需求日益增长。CQBF氟塑料磁力泵作为这一需求下的创新产品&#xff0c;已经成为许多企业提升工艺水平和确保环境安全的关键工具。本文旨在深入探讨CQBF氟塑料磁力泵的技术特点、应用优势…

qt5-入门-ModelView架构1

参考&#xff1a; Qt model-view 架构_w3cschool https://www.w3cschool.cn/learnroadqt/vtxz1j4y.html QListWidget_w3cschool https://www.w3cschool.cn/learnroadqt/yb2k1j51.html C GUI Programming with Qt 4, Second Edition 本地环境&#xff1a; win10专业版&#x…

SqlServer期末复习(数据库原理及应用)持续更新中

一、SQL语句 1.1 SQL语句知识引入 1.DDL语言(数据定义语言&#xff09;主要是进行定义/改变表的结构、数据类型、表之间的链接等操作&#xff0c;关键字CREATE、DROP、ALTER CREATE TABLE 表面( 列名1 数据类型&#xff0c; 列名2 数据类型&#xff0c; ) ALTER TABLE 表名&a…

[Android]模拟器登录Google Play失败

问题&#xff1a; 模拟器登录Google Play失败&#xff0c;提示couldnt sign in there was a problem communicating with google servers. try again later. 原因&#xff1a; 原因是模拟器没有连接到互联网&#xff0c;打开模拟器中Google浏览器进行搜索一样不行。 解决&am…

2.9、创建网格(Grid/GridItem)

概述 网格布局是由“行”和“列”分割的单元格所组成,通过指定“项目”所在的单元格做出各种各样的布局。网格布局具有较强的页面均分能力,子组件占比控制能力,是一种重要自适应布局,其使用场景有九宫格图片展示、日历、计算器等。 ArkUI提供了Grid容器组件和子组件GridI…

JDBC基础编程练习

目录​​​​​​​ 第1关&#xff1a;JDBC更新员工密码 任务描述 实验一代码&#xff1a; 第2关&#xff1a;JDBC查询员工信息 任务描述 实验二代码&#xff1a; 第1关&#xff1a;JDBC更新员工密码 任务描述 本关任务&#xff1a;借助JDBC在库名tsgc中完成对数据表emp…

Python:基础语法

一、import与from.....import 有时候我们需要使用一些第三方库或包时&#xff0c;我们就需要通过import或from.....import导入模块。 # 导入库 import sys print("hello,world") 当我们自己写了些函数&#xff0c;在其他py文件&#xff0c;我们也可以通过from.....im…

SQL练习【个人练习】

SQL练习&#xff0c; 去除了过于简单的SQL语句 常用函数的使用concat&substringlike&left切割&正则比较&时间函数(date_format/year/month)时间函数匹配 group by子查询Union 前几天做笔试的时候狠狠拷打了SQL&#xff0c;并不是很难的题目&#xff0c;现在想起…

leetcode 225.用队列实现栈 JAVA

题目 思路 1.一种是用双端队列&#xff08;Deque&#xff09;&#xff0c;直接就可以调用很多现成的方法&#xff0c;非常方便。 2.另一种是用普通的队列&#xff08;Queue&#xff09;,要实现栈的先入后出&#xff0c;可以将最后一个元素的前面所有元素出队&#xff0c;然后…

机器学习基础——模型评估与选择(部分)

为了实现对模型指导&#xff0c;实现自主建模&#xff0c;我们会对模型进行选择和评估&#xff0c;主要有以下几个问题&#xff1a; 一、前言&#xff1a;误差与拟合 &#xff08;一&#xff09;经验误差 使用上述流程理解&#xff0c;其中 a 为预测错误的个数&#xff0c;m为…

【Rust】——提取函数消除重复代码和泛型

&#x1f383;个人专栏&#xff1a; &#x1f42c; 算法设计与分析&#xff1a;算法设计与分析_IT闫的博客-CSDN博客 &#x1f433;Java基础&#xff1a;Java基础_IT闫的博客-CSDN博客 &#x1f40b;c语言&#xff1a;c语言_IT闫的博客-CSDN博客 &#x1f41f;MySQL&#xff1a…

工时表软件:项目管理的效率利器

在当今的项目管理实践中&#xff0c;时间是最宝贵的资产之一。精准地追踪和管理项目工时对于项目的成功至关重要。工时表软件作为一种现代管理工具&#xff0c;其应用不仅简化了项目管理流程&#xff0c;还提高了工作效率&#xff0c;已成为现代企业管理不可或缺的一项利器。 …