鸿蒙渲染任务列表

编写网络接口

export const getTaskList = async (params:TaskListParams) =>{

  let data:object=params as object

  let urlStr=''


    // data参数都拼接到地址上  ?a=1&b=2&c=3
    if (data && Object.keys(data).length) {
      urlStr += "?" + Object.keys(data).filter(key => !!data[key]).map(key => {
        return `${key}=${data[key]}`
      }).join("&")
    }


  const axios:AxiosResponse<AxiosResponseData<TaskListData>> = await axiosInstance.get<null,AxiosResponse<AxiosResponseData<TaskListData>>,TaskListParams>('/driver/tasks/list'+urlStr)

  return axios

}

接受数据渲染列表

Scroll(){
  Column(){
    if(this.taskListData===null){
      Text('没了没了').textAlign(TextAlign.Center).width('100%')
    }else {
      List(){
        ForEach(this.taskListData,(item:TaskInfoItem)=>{
          ListItem(){
            TaskItemCard({taskItemData:item})
          }
        })
      }.width('100%').height('100%')
    }
}.height('100%').width('100%')
}