工程竣工验收公示网,百度seo关键词优化si,WordPress网站结构优化,线下引流的八种推广方式上文 HarmonyOS组件属性控制 链式编程格式推荐我们讲了一些系统组件 可以传入一些事件和参数 来达到一些不同的效果
其实 我们还可以用自己写的组件 那么 组件这么写#xff1f; 其实 我们的 page 内部结果 就是一个组件 harmonyOS的概念 万物皆组件 那么 我们就可以在他下面…上文 HarmonyOS组件属性控制 链式编程格式推荐我们讲了一些系统组件 可以传入一些事件和参数 来达到一些不同的效果
其实 我们还可以用自己写的组件 那么 组件这么写 其实 我们的 page 内部结果 就是一个组件 harmonyOS的概念 万物皆组件 那么 我们就可以在他下面加一个 可以看到 这样也是没有问题的
但最上面 有一个 Entry装饰器 整个文件中只能有一个组件被 它修饰 修饰了Entry就是这个文件的入口 每次进入页面 都是展示出 Entry修饰的组件内容
我们第二个组件 目前这个写法是有问题的 build组件下必须有 且只能有一个组件 作为组件的根元素组件
我们可以将page代码改写如下
Entry
Component
struct Index {build() {Row() {Column() {imist();imist();imist();}.width(100%)}.height(100%)}
}Component
struct imist {build() {Row() {Image($r(app.media.img)).width(20).height(20).margin(15)Text(你好).fontColor(Color.White)}.backgroundColor(Color.Blue).borderRadius(25).margin({top: 15}).width(80%)}
}这里 我们在page主体下面又写了一个组件 内容大概是 Row声明一行 然后 这一行中 有一个 image图片组件 然后 图片的高宽都设为20 给 15的边距
然后 Text文本组件 内容你好 然后 给他设置了个字体颜色 Color中的白色White
然后 Row 这一行样式设置为 宽度百分之 80 边距 只设上边距 15 然后 背景颜色设为Blue 蓝色 圆角效果 25
然后 我们页面主体 Entry 修饰的入口组件 用了三个我们写的 imist 组件 运行结果如下
但是这样 如果我们想文本不同呢 自定义组件 是可以传递参数的哦
我们将代码改成这样
Entry
Component
struct Index {build() {Row() {Column() {imist({content: 第一个组件接到值了});imist({content: 第二个组件也接到啦});imist({content: 我这边也OK});}.width(100%)}.height(100%)}
}Component
struct imist {private content:string 青山不改绿水长流;build() {Row() {Image($r(app.media.img)).width(20).height(20).margin(15)Text(this.content).fontColor(Color.White)}.backgroundColor(Color.Blue).borderRadius(25).margin({top: 15}).width(80%)}
}我们这里父组件 传递了一个对象 里面有一个字段 content 对应的都是一个字符串内容
然后子组件中声明这个私有参数 content 声明为 string 字符串类型 然后 给了个默认值 “青山不改绿水长流” 然后 我们的 Text组件用了这个变量
运行结果如下 可以看到 外面传递值是生效了的