HarmonyOS 创建components目录 定义全局自定义组件导出供整个项目使用

之前我的文章 harmonyOS 自定义组件基础演示讲解 我们讲解了 自定义组件的基础用法
但是 我们是写在单个page文件中的 这样 我们跨文件使用就很不友好了

如下图 指向 ets目录下 创建一个目录
在这里插入图片描述
按我们 前端开发以往的习惯 这个目录要叫 components 专门放组件集合的地方
然后 按回车 创建目录
在这里插入图片描述
我们在下面创建一个文件 类型肯定是我们 ArkTS 类型的 file
在这里插入图片描述
这里 我们文件随便取名 我这里就叫 General 通用的意思
然后按回车 创建文件
在这里插入图片描述
然后 我们贴一段自定义组件的代码进去

@Component
export struct General {build() {Row() {Text("我是一个自定义组件").fontSize(30)}.margin({top: 15}).width("100%")}
}

因为 要让别的模块使用 所以 我们这里 要用 export 将它导出出来
在这里插入图片描述
然后 我们在需要使用的地方导入
在这里插入图片描述
这里 我们 index.ets 在pages目录下 和 components 在同一目录 那么 我们 …/ 找到上级 目录 然后 找到下面的 components 下的 General
导入它的 General 组件
运行效果如下
在这里插入图片描述
这样就确认 我们组件已经成功导进来了

因为 我们同一个文件 可以写多个组件 所以大部分是 export 导出
如果你确定这个文件只导出一个组件 那么 用 export default
肯定更方便 这个看开发中需要

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

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

相关文章

macbook电脑如何永久删除app软件?

在使用MacBook的过程中,我们经常会下载各种App来满足日常的工作和娱乐需求。然而,随着时间的积累,这些App不仅占据了宝贵的硬盘空间,还可能拖慢电脑的运行速度。那么,如何有效地管理和删除这些不再需要的App呢&#xf…

Unity BuffSystem buff系统

Unity BuffSystem buff系统 一、介绍二、buff系统架构三、架构讲解四、框架使用buff数据Json数据以及工具ShowTypeBuffTypeMountTypeBuffOverlapBuffShutDownTypeBuffCalculateType时间和层数这里也不过多说明了如何给生物添加buff 五、总结 一、介绍 现在基本做游戏都会需要些…

Gitlab和Jenkins集成 实现CI (二)

配置Gitlab api token 配置 Gitlab 进入gitlab #mermaid-svg-QQWExcx5fpZ59Sk7 {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#000000;}#mermaid-svg-QQWExcx5fpZ59Sk7 .error-icon{fill:#552222;}#mermaid-svg-QQWExcx5fpZ59Sk7 .e…

微信小程序(三十九)表单信息收集

注释很详细&#xff0c;直接上代码 上一篇 新增内容&#xff1a; 1.表单收集的基本方法 2.picker的不足及解决方法 源码&#xff1a; index.wxml <!-- 用户信息 --> <view class"register"><!-- 绑定表单信息收集事件--><form bindsubmit"…

Linux下的多线程

前面学习了进程、文件等概念&#xff0c;接下里为大家引入线程的概念 多线程 线程是什么&#xff1f;为什么要有线程&#xff1f;线程的优缺点Linux线程操作线程创建线程等待线程终止线程分离 线程间的私有和共享数据理解线程库和线程id深刻理解Linux多线程&#xff08;重点&a…

AI大模型开发架构设计(9)——AI 编程架构刨析和业务应用实战案例

文章目录 AI 编程架构刨析和业务应用实战案例1 AI编程代码生成模型剖析编程方式的发展代码自动生成基于大模型的AI编程工具——Github Copilot以 CodeGeeX 为例-发展过程以 CodeGeeX 为例-训练过程以 CodeGeeX 为例-大规模代码数据处理以 CodeGeeX 为例-模型结构以 CodeGeeX 为…

【开源】基于JAVA+Vue+SpringBoot的新能源电池回收系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 用户档案模块2.2 电池品类模块2.3 回收机构模块2.4 电池订单模块2.5 客服咨询模块 三、系统设计3.1 用例设计3.2 业务流程设计3.3 E-R 图设计 四、系统展示五、核心代码5.1 增改电池类型5.2 查询电池品类5.3 查询电池回…

this指针剖析

this指针 this指针引出&#x1f4a6;特性&#x1f4a6;this指针存储位置 this指针 引出&#x1f4a6; 我们先来定义一个日期类 Date class Date { public: void Init(int year, int month, int day) { _year year; _month month; _day day; } void Print() { cout <<…

spring Bean 生命周期 源代码分析

文章目录 一、生命周期关键步骤1.1 前置条件1.2 创建bean 二、Bean生命周期、核心源码分析2.1 前置条件, 源代码2.2 创建bean, 源代码 一、生命周期关键步骤 1.1 前置条件 1.创建rootBean 生成RootBeanDefinition 2.对bean定义的方法&#xff0c;进行验证、重写 调用方法pre…

5G NR 频率计算

5G中引入了频率栅格的概念&#xff0c;也就是小区中心频点和SSB的频域位置不能随意配置&#xff0c;必须满足一定规律&#xff0c;主要目的是为了UE能快速的搜索小区&#xff1b;其中三个最重要的概念是Channel raster 、synchronization raster和pointA。 1、Channel raster …

用的到的linux-查找find-Day4

前言&#xff1a; 在上一节&#xff0c;我们了解到rm删除命令&#xff0c;一共拥有三种模式&#xff0c;即-i默认只能删除文件且会提示确认&#xff0c;其次是-r 遍历删除&#xff0c;用于删除目录及目录下的文件&#xff0c;同样需确认后才会删除&#xff0c;最后为-f为强制删…

猫头虎分享已解决Bug || TypeError: Cannot set property ‘innerHTML‘ of null

博主猫头虎的技术世界 &#x1f31f; 欢迎来到猫头虎的博客 — 探索技术的无限可能&#xff01; 专栏链接&#xff1a; &#x1f517; 精选专栏&#xff1a; 《面试题大全》 — 面试准备的宝典&#xff01;《IDEA开发秘籍》 — 提升你的IDEA技能&#xff01;《100天精通鸿蒙》 …