(Arkts界面示例)ets pages Demo

Index.ets 文件

TypeScript 复制代码
import router from '@ohos.router'

@Entry//表示该自定义组件为入口组件
@Component //表示自定义组件
struct Index {//表示组件中的状态变量,状态变量变化会触发UI刷新
  @State changeValue: string = ''
  @State submitValue: string = ''
  controller: SearchController = new SearchController()

  build() {
    Column() {

      Search({ value: this.changeValue, placeholder: 'file name', controller: this.controller })
        .searchButton('SEARCH')
        .width(300)
        .height(50)
        .backgroundColor('#F5F5F5')
        .placeholderColor(Color.Grey)
        .placeholderFont({ size: 15, weight: 550 })
        .textFont({ size: 15, weight: 500 })
        .copyOption(CopyOptions.InApp)
        .onSubmit((value: string) => {
          this.submitValue = value
          router.pushUrl({url:'pages/'+this.submitValue})
        })
        .onChange((value: string) => {
          this.changeValue = value
        })
        .margin(20)

    }.width('100%')
  }
}

hello.ets

TypeScript 复制代码
import router from '@ohos.router'

@Entry
@Component
struct hello{
  build() {
    Column({ space: 5 }) {

      Text('首页').onClick(() => {
        router.pushUrl({ url: 'pages/Index' })
      })

      Text('Hello worid').fontSize(20)
    }.width('100%').margin({top:10})
  }
}
相关推荐
芊寻(嵌入式)13 分钟前
C转C++学习笔记--基础知识摘录总结
开发语言·c++·笔记·学习
准橙考典41 分钟前
怎么能更好的通过驾考呢?
人工智能·笔记·自动驾驶·汽车·学习方法
密码小丑2 小时前
11月4日(内网横向移动(一))
笔记
鸭鸭梨吖3 小时前
产品经理笔记
笔记·产品经理
齐 飞3 小时前
MongoDB笔记01-概念与安装
前端·数据库·笔记·后端·mongodb
丫头,冲鸭!!!4 小时前
B树(B-Tree)和B+树(B+ Tree)
笔记·算法
听忆.4 小时前
手机屏幕上进行OCR识别方案
笔记
Selina K5 小时前
shell脚本知识点记录
笔记·shell
5 小时前
开源竞争-数据驱动成长-11/05-大专生的思考
人工智能·笔记·学习·算法·机器学习
霍格沃兹测试开发学社测试人社区6 小时前
软件测试学习笔记丨Flask操作数据库-数据库和表的管理
软件测试·笔记·测试开发·学习·flask