ошибка typescrpt: введите 'ITreeNode <{}> [] | undefined 'нельзя назначить типу' ITreeNode <{}> [] ' - PullRequest
Новая
       8

ошибка typescrpt: введите 'ITreeNode <{}> [] | undefined 'нельзя назначить типу' ITreeNode <{}> [] '

0 голосов
/ 03 июня 2019

У меня есть компонент реакции, и в этом компоненте реакции я использую функцию дерева blueprint.js для рендеринга дерева на основе объекта json, возвращенного с сервера.У меня проблема с типом, которую я пытаюсь исправить, но я не уверен, откуда она берется ... это ошибка: 

Type 'ITreeNode<{}>[] | undefined' is not assignable to type 'ITreeNode<{}>[]'.
  Type 'undefined' is not assignable to type 'ITreeNode<{}>[]'.ts(2322)
HelpTree.tsx(11, 5): The expected type comes from property 'nodes' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<HelpTree> & Readonly<State> & Readonly<{ children?: ReactNode; }>'

Я не уверен, почему я получаю эту ошибкуили как это исправить.

вот исходный код.Я использую дерево из чертежа, и я назначаю ITreeNode после его динамической сборки. 

export const HelpDialog: React.FC = () => {
    const themeClass = useBehavior(mainStore.themeClass);
    const isOpen = useBehavior(mainStore.isHelpDialogVisible);

    const [files, setFiles] = useState([]);

    const [folderLoading, setFolderLoading] = useState(false);

    const InitialState: ITreeNode[] = [];

    let currentNode: HelpDTO;
    let parentFolder: any = {};
    let majorFolder: any = {};
    let majorFile: any = {};

    useEffect(() => {
        if (isOpen) {
            fetchHelp();
        }
    }, [isOpen]);

    const fetchHelp = () => {
        helpApi.getHelpFiles().then((response) => {
            if (response.status !== 200) return;
            setFiles(response.data);
            checkFileContent();
        });
    };

    return (
        <Dialog
            className={classNames(themeClass, styles.helpDialog)}
            title="Help"
            icon="help"
            isOpen={isOpen}
            onOpened={fetchHelp}
            onClose={closeDialogBox}
        >
            <div style={{ overflowY: "scroll" }}>
                {folderLoading ? <HelpTree nodes={setNodes(files)} /> : <Spinner />}
            </div>
        </Dialog>
    );
};

ошибка исходит от 5-й от последней строки: 

{folderLoading ? <HelpTree nodes={setNodes(files)} /> :

где узлыдекальдировано:

здесь дерево объявлено: 

interface Props {
    nodes: ITreeNode[];
}

export interface State {
    nodes: ITreeNode[];
}

// use Component so it re-renders everytime: `nodes` are not a primitive type
// and therefore aren't included in shallow prop comparison
export class HelpTree extends React.Component<State, Props> {
    constructor(props: Props) {
        super(props);
        this.state = {
            nodes: props.nodes
        };
    }

    render() {
        return (
            <Tree
                contents={this.state.nodes}
                onNodeCollapse={this.handleNodeCollapse}
                onNodeExpand={this.handleNodeExpand}
                onNodeDoubleClick={this.handleNodeDoubleClick}
            />
        );
    }
}

1 Ответ

0 голосов
/ 04 июня 2019

Ошибка говорит вам, что ваша функция setNodes может возвращать "undefined" вместо ITreeNode.

Вы можете изменить тип, где объявлено ваше дерево, заменив это: 

interface Props {
    nodes: ITreeNode[];
}

с этим: 

interface Props {
    nodes: ITreeNode[] | undefined;
}

Или вы можете проверить setNodes, чтобы убедиться, что он никогда не вернется "undefined"

...