时间戳

首页 > 解决方案 > 如何修复“CheckBoxData []类型上不存在属性'值'”？

javascript - 如何修复“CheckBoxData []类型上不存在属性'值'”？

问题描述

我最近试图将 React 应用程序从 JS 转换为 TS。在这样做时，我想出了这个问题。以及如何解决这个问题的想法。我转换为 ts 方法错了吗？

我在我的 JS 代码中添加了接口，希望就是这样，但我无法解决这个问题

export default React.memo<CheckBoxProps>(
  ({
**line23->**  data: { value, editable = true, error, label, required = false, name },
    focused,
    userColor,
    listeners
  }) => {
    const hasError = !!error;
    return (
      <CheckboxWrapper focused={focused} userColor={userColor}>
        <Checkbox
          name={name}
          isChecked={value}
          isInvalid={hasError}
          // isDisabled={!editable}
          isRequired={required}
          label={label}
          {...listeners}
        />
        {error && <Error>{error}</Error>}
      </CheckboxWrapper>
    );
  }
);

interface CheckBoxProps {
  data: CheckBoxData[];
  focused: boolean;
  userColor;
  listeners;
}

export interface CheckBoxData {
  value: number;
  editable: boolean;
  error: string;
  label: string;
  required: boolean;
  name: string;
}

错误显示：TS2339：“CheckBoxData []”类型上不存在属性“值”。

标签： javascriptreactjstypescript

解决方案

我最好的猜测是你需要data: CheckBoxData代替data: CheckBoxData[].

interface CheckBoxProps {
  data: CheckBoxData;
  focused: boolean;
  // type missing in following properties, temporarily fixed with any
  userColor: any;
  listeners: any;
}

我认为错误消息是非常不言自明的，它具有创建数组的data类型。因此，该行上的破坏就像 write 一样，数组没有属性，因此会出现错误。CheckBoxData[]datadata.valuevalue

推荐阅读