1.

问题1.A页面网路请求分发给A的子组件,由于子组件在AboutToApper 里进行了数据调用,导致报错

解决方案1.在子组件的数据加上@monitor  检测到有数据之后再进行使用

解决方案2.父组件监听数据变化,定义整体组件或者子组件的显示开关,监听到有数据之后再打开数据显示开关

解决方案3.可以在A页面之前,例如首页需要数据,可以在引导页/启动页进行数据请求,传给A页面

2.网络请求数据的同名数据

注意细节:数据转换的时候尽量data ->dataX  大写X

类中的变量名 和 类名 区分

问题3.NavDestination 的OnShow  和 OnHide 方法 会在弹窗显示关闭的时候重新走一遍

问题4:本地资源图片获取数据和网络图片 方式不同,流不一样

漫画动态壁纸:

问题1:scroll 嵌套list滑动  必须 内部的高度大于Scroll 的高度

实例:

/**
 * @Author : zqf
 * @Description : 广告页/引导页
 */
import { CacheType, Net } from '@abner/http';
import { DataIndex, IndexBean } from '../../models/index/IndexBean';
import { DataTabIndex, TabIndexBean } from '../../models/tabindex/TabIndexBean';
import HttpConst from '../HttpConst';
import { taskpool } from '@kit.ArkTS';
import { BaseDataSource } from '../../models/datasource/BaseDataSource';
import { AppUtil, ToastUtil } from '@pura/harmony-utils';
import App from '@system.app';


@ComponentV2
export struct CompTabIndex {
  @Consumer('pathInfos') pathInfos: NavPathStack = new NavPathStack();
  @Param mIndexBean: IndexBean = Object()
  controller: TabsController = new TabsController()
  @Local mCurrentIndex: number = 0
  scroller: Scroller = new Scroller()
  @Local isShow: boolean = false
  @Local mDataSource: BaseDataSource<DataTabIndex> = new BaseDataSource()

  @Builder
  tabItem(item: DataIndex, index: number) {
    Text(item.title)
      .fontSize(14)
      .fontColor(index === this.mCurrentIndex ? '#000' : '#949494')
      .padding({
        left: 16,
        right: 16,
        top: 8,
        bottom: 8
      })
      .backgroundColor(this.mCurrentIndex === index ? '#ffd04f' : '#fff')
      .borderRadius(16)
      .margin({ left: 8, right: 8 })
  }

  requestData(categoryId: string) {
    let URL = HttpConst.IndexMuYu + '?categoryIds=' + categoryId + '&version=2'
    Net.get(URL)
      .setCacheType(CacheType.FIRST_CACHE)
      .setHeaders({
        'Content-Type': 'application/json',
        'platformCode': 'HARMONYOS',
        'productId': HttpConst.productId,
      })
      .request<TabIndexBean>((data) => {
        this.mDataSource.pushArray(data.data.data)
        this.isShow = true
      });
  }

  aboutToAppear(): void {
    this.requestData(this.mIndexBean.data.data[this.mCurrentIndex].categoryId)
  }

  build() {
    if (this.isShow) {
      Scroll() {
        Column() {
          // //
          // Column(){}
          // Column(){
          //   Row(){}
          //   Scroll()
          // }.height('100%')

          Stack({ alignContent: Alignment.Top }) {
            Text()
              .width('100%')
              .height('20%')
              .backgroundColor('#ffd04f')

            Column() {

              Blank().width('100%').height(px2vp(AppUtil.getStatusBarHeight()))
              Stack({ alignContent: Alignment.Bottom }) {

                Image($r('app.media.index_search_bg'))
                  .width('86%')
                  .objectFit(ImageFit.Fill)

                Column() {
                  Row() {
                    Image($r('app.media.search'))
                      .width(16).height(16).objectFit(ImageFit.Fill)
                      .margin({ left: 10 })
                    Text('搜索你想要的')
                      .margin({ left: 10 }).fontSize(14).fontColor('#949494')
                  }
                  .border({
                    width: 1,
                    color: '#ffd04f',
                    radius: 20
                  })
                  .width('60%')
                  .height(40)
                  .backgroundColor('#fff')
                  .onClick(() => {
                    this.pathInfos.pushPathByName('PageSearch', this.mIndexBean, false)
                  })

                }.width('100%')
                .offset({ y: 10 })
              }
            }
          }.width('100%')

          Column(){
            Tabs({ barPosition: BarPosition.Start, controller: this.controller, index: this.mCurrentIndex }) {
              ForEach(this.mIndexBean.data.data, (item: DataIndex, index: number) => {
                TabContent() {

                }.tabBar(this.tabItem(this.mIndexBean.data.data[index], index))
              }, (item: DataTabIndex) => {
                return JSON.stringify(item)
              })
            }
            .margin({ top: 10 })
            .fadingEdge(false)
            .vertical(false)
            .barMode(BarMode.Scrollable)
            .barHeight(50)
            .edgeEffect(EdgeEffect.None)
            .onAnimationStart((index, targetIndex) => {
              this.mCurrentIndex = targetIndex
              this.mDataSource.deleteAll()
              this.requestData(this.mIndexBean.data.data[targetIndex].categoryId)
            })
            .scrollable(true)
            .width('100%')
            .height(50)


            //scroller: this.scroller ,
            List({ space: 4 }) {
              LazyForEach(this.mDataSource, (item: DataTabIndex, index) => {
                ListItem() {
                  Image(item.resourcePreviewUrl)
                    .width('100%')
                    .aspectRatio(1)
                    .objectFit(ImageFit.Cover)
                    .constraintSize({ maxWidth: '100%' })
                    .margin({ left: 16, right: 16 })
                    .borderRadius(10)
                }
              })
            }
            .cachedCount(6)
            .edgeEffect(EdgeEffect.None)
            .scrollBar(BarState.Off)
            // .enableScrollInteraction(false)
            .nestedScroll({
              scrollForward: NestedScrollMode.PARENT_FIRST,
              scrollBackward: NestedScrollMode.PARENT_FIRST
            })
            .width('100%') .layoutWeight(1) // List
          }.width('100%').height('100%')


        }.width('100%')

      }.width('100%').height('100%') // Scroll
    }

  }
}

华为一键登录  

假如所有的都配置好了,那就吧版本号改一下试试