wwf
2025-10-01 5f97e4b263b76b25f22592c02fbd482977e043bc
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
import { CommonConstantWX } from "../../common/CommonConstantWX"
import { WxUserInfoBase } from "../../data/WxUserInfoBase"
 
/*
 * Search({placeholder: '请输入您要搜索的内容',value: 'DeepSeek'})
        .width('90%')
        .backgroundColor(Color.White)
        .searchButton('搜索')
        .onChange((value: string) => {
          console.info(`输入的内容为:${value}`)
        })
        //提交方法
        .onSubmit((value:string) => {
          console.info(`提交的内容为:${value}`)
        })
 * */
@Entry
@Component
export struct MessagePage {
  @State userList:Array<WxUserInfoBase> = CommonConstantWX.mUser
  @State searchUser:Array<WxUserInfoBase> = []
  build() {
    Column({space: 10}) {
      Search({placeholder: '搜索'})
        .backgroundColor(Color.White)
        .width('90%')
        .borderRadius(5)
        .onChange((value: string) =>{
          //每次输入都要清空searchUser数组
          this.searchUser = []
          let searchCount = 0
          //进行遍历,在数组源头查找和value相关的数据
          for (let index = 0; index < this.userList.length; index++) {
            const element = this.userList[index];
            //判断每一条数据是否有和Value相关的内容
            if (element.name?.indexOf(value) != -1) {
              //找到相关的数据,添加到search数组当中,并且数据加一
              searchCount ++
              this.searchUser.push(element)
            }
          }
          //判断SearchCount是否为0
          if (searchCount === 0) {
            //表示查无此人
            this.searchUser.push({
              id: 999,
              name: '无此用户',
              img:$r('app.media.avatar_icon')
            })
          }
 
        })
      List({space: 20}){
        ForEach(this.searchUser.length === 0 ? this.userList: this.searchUser,(item: WxUserInfoBase) => {
          ListItem(){
            userInfoItem({item: item})
          }
        })
      }
      .height('90%')
      .padding({top:10})
      .margin({bottom: 30})
      .backgroundColor(Color.White)
      .divider({strokeWidth: 2,color: '#ccc'})
    }
    .height('100%')
    .width('100%')
    .backgroundColor('#ccc')
  }
}
 
@Component
struct userInfoItem {
  @Prop item: WxUserInfoBase
  build() {
    Row({space: 15}){
      Image(this.item.img)
        .width(40)
        .height(40)
        .objectFit(ImageFit.Cover)
      Text(this.item.name)
        .fontSize(20)
    }
    .onClick(() => {
      this.getUIContext().getRouter().pushUrl({
        url: 'pages/message/MessageDetailsPage',
        params:{
          userInfo: this.item
        }
      })
    })
    .padding(10)
  }
}