harmony开发遇到的问题

1. arkt-no-props-by-index
2. Property ‘name’ has no initializer and is not definitely assigned in the constructor.
3. arkts-no-any-unknown

typescript 中的报错 Property ‘name’ has no initializer and is not definitely assigned in the construc…
ArkTs编译常见错误汇总（更新中）
从TypeScript到ArkTS的迁移指导【坚果派】
TypeScript（三）对象类型

4. Assigning the attribute ‘option’ to the ‘@ObjectLink’ decorated attribute ‘imageKnifeOption’ is not allowed.

意思就是把option变量传给@ObjectLink修饰的变量imageKnifeOption是不允许的。option是个普通的变量，不是状态变量，用@state装饰就好了

如果把组件描述的代码提取到@Builder函数中，就没有这个限制
5.
【HarmonyOS】鸿蒙应用安装三方包后，为什么每次同步更新都会将三方包更新成最新版本？

这个是因为Edit Configuration中，Deply Multi Hap中module没有勾选上appDevSearch

7. 箭头函数this问题
   对于普通的函数，this就是函数的接收者，也就是函数的调用方，但是箭头函数this是外部对象。
   箭头函数this的指向

有遇到函数中this不对的情况，可以通过箭头函数包裹一下就对了

  build() {
    Column() {
      SearchHomeFoundHeader({title: "搜索发现", showTopBlank: true, refreshAction: () => {this.refreshAction()}})

    }
  }
  refreshAction() {
    let currentShowCount = this.currentItemWordArr.length;
    let totalCount = this.itemWordArr.length
    if (currentShowCount < totalCount) {
      let tmpArr = this.itemWordArr.splice(0, currentShowCount)
      // 放到末尾
      tmpArr.forEach(item => {
        this.itemWordArr.push(item)
      })
      this.updateCurrentItemWordArr()
    }
  }

SearchHomeFoundHeader({title: “搜索发现”, showTopBlank: true, refreshAction: this.refreshAction})
这样写是不对的，上面用箭头函数包裹才正确

8. 怎么给一个变量赋值对象，类似java的匿名内部类
   其实和java类似，定义变量名，指定变量类型，实例化对象，只不过java中不用new关键字

  private observer: Observer<string> = {
    onChanged(word: string) {
      this.searchInput = word
      this.clickSearchFunc(word)
    }
  }

不过这里面的this，是匿名对象的this，不是外部对象的。那想访问外部对象的资源怎么办呢？
java中可以通过类名.this来实现，在javaScript中没有这种语法

9. javascript中怎么使用外部对象呢？
   如果是在一个大函数里面，使用匿名对象，可以在大函数内提前把外部对象的this存成self，这样匿名对象使用self就能访问外部对象。
   直接把匿名对象赋值给变量的用法，这种场景，怎么使用外部对象呢？
   答案就是使用立即执行函数包裹一下。
   JavaScript 匿名函数几种执行方式[通俗易懂]

不过在鸿蒙中，得用箭头函数，会提示错误
(function(){})()
Use arrow functions instead of function expressions (arkts-no-func-expressions)

  private observer: Observer<string> = ((self) => {
    return {
      onChanged(word: string) {
        self.searchInput = word
        self.clickSearchFunc(word)
      }
    }
  })(this)


  private observer: Observer<string> = (() => {
    const self = this
    return {
      onChanged(word: string) {
        self.searchInput = word
        self.clickSearchFunc(word)
      }
    }
  })()

10. TypeScript中的interface怎么使用
    TS中interface相当于定义了一个类型，有类型就能创建这个类型的值。和java中的interface的概念不一样，我们要想实例化一个对象，必须先有类才行。在TS中不用

export interface MessageBoxItemData {
  timeTip?: string;
  userInfo?: UserInfo;
  timeLong?: number;
  messageId?: string;
  boxType?: number;
  rootMpId?: string;
  type: number;
  likeNum?: number;
  originCommentUser?: OriginCommentUser;
  duplicateCount?: number;
  cateOne?: number;
  totalFavorNum?: number;

  comment?: commentModel;
  rootComment?: commentModel;
  originComment?: commentModel;

  vidInfo?: VidInfo;
  forwordContent?: ForwordContent;
  topicInfo?: TopicInfo;
  liveInfo?: LiveInfo;
  broadlistInfo?: BroadlistInfo;

  // 本地添加的数据
  cardMessage?: CardMessage;
  favorMessage?: FavorMessage;
}

      let favorMessage: MessageBoxItemData = {
        type: MessageBoxUtil.MESSAGE_TYPE_LIKE_COMBINE,
        favorMessage: entity.favorMessage
      }

练习 - 在 TypeScript 中声明和实例化接口
typescript接口的应用举例 typescript接口与类
11. 一行两个Text，第一个text长度自适应怎么实现
如何解决 Text 单行长文本自动宽度超出期望的范围

import { CommonConstants } from '@sohuvideo/commonUi'
import measure from '@ohos.measure'

const TAG = '[SingleLayerTemplateView]'

@Component
@Preview
export struct SingleLayerTemplateView {
  @Prop commentUserName: string = '丑萌丑萌的萌宠丑萌丑萌的萌宠丑萌丑萌的萌宠丑萌丑萌的萌宠丑萌丑萌的萌宠丑萌丑萌的萌宠丑萌丑萌的萌宠'
  @Prop commentUserAction: string = '评论了我评论过的直播'
  textWidth: number = 0

  aboutToAppear(): void {
    this.textWidth = px2vp(measure.measureText({
      textContent: this.commentUserAction,
      fontSize: '13fp'
    }))
  }

  build() {

    Column() {
      Flex({direction: FlexDirection.Row}) {
        Text(this.commentUserName)
          .fontSize(13)
          .fontColor($r('app.color.c_4a90e2'))
          .margin({top: 4})
          .maxLines(1)
          .textOverflow({overflow: TextOverflow.Ellipsis})
          .constraintSize({
            maxWidth: `calc(100% - ${this.textWidth}vp)`
          })

        Text(this.commentUserAction)
          .fontSize(13)
          .fontColor($r('app.color.c_999999'))
          .margin({top: 4})
          .maxLines(1)

      }.width(CommonConstants.FULL_PERCENT)
    }

  }
}

13. 嵌套滑动的坑
    在做嵌套滑动需求的时候，需要一个大坑，折腾的三小时才找到原因
    一般嵌套滑动都是这样的结构

import CommonConstants from '../../common/constants/CommonConstants';

const listArr: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15];

@Entry
@Component
struct NestedScroll2 {
  @State message: string = 'Hello World';

  private scrollerForScroll: Scroller = new Scroller();
  private scrollerForList: Scroller = new Scroller();

  build() {
    Scroll(this.scrollerForScroll) {
      Column() {
        Image($r("app.media.banner"))
          .width(CommonConstants.FULL_WIDTH)
          .height($r('app.float.image_height'))
          .borderRadius($r('app.float.list_item_radius'))
          .padding({
            left: $r('app.float.list_item_padding'),
            right: $r('app.float.list_item_padding')
          })

        List({ space: CommonConstants.LIST_SPACE, scroller: this.scrollerForList }) {
          ForEach(listArr, (item: number) => {
            ListItem() {
              Text('listName' + item)
                .width(CommonConstants.FULL_WIDTH)
                .height(CommonConstants.FULL_HEIGHT)
                .borderRadius($r('app.float.list_item_radius'))
                .fontSize($r('app.float.middle_font_size'))
                .fontWeight(CommonConstants.FONT_WEIGHT_FIVE)
                .padding({ left: $r('app.float.list_item_padding') })
                .backgroundColor(Color.White)
            }
            .width(CommonConstants.FULL_WIDTH)
            .height($r('app.float.list_item_height'))
          }, (item: string) => JSON.stringify(item))
        }
        .padding({
          left: $r('app.float.list_padding'),
          right: $r('app.float.list_padding')
        })
        .width(CommonConstants.FULL_WIDTH)
        .height(CommonConstants.FULL_HEIGHT)
        .edgeEffect(EdgeEffect.None)
        .scrollBar(BarState.Off)
        .nestedScroll({
          scrollForward: NestedScrollMode.PARENT_FIRST,
          scrollBackward: NestedScrollMode.SELF_FIRST
        })
      }
    }
    .scrollBar(BarState.Off)
    .width(CommonConstants.FULL_WIDTH)
    .height(CommonConstants.FULL_HEIGHT)
  }
}

在滑动内部list的时候，外面的scroll可以先滑动，这样的话，就可以把上面展示的图片滑出屏幕。
但是，但是，但是
如果给Scroll里面的Column设置高的话，嵌套滑动就失效了，图片滑不出屏幕，如果column设置了top margin，最多把这些距离滑掉。

这个真是大坑