Problems with TypeScript federation types

interface ModuleA{
    width: number;
    height: number;
}

interface ModuleB{
    width: number;
    offset: number;
}

function test(params: ModuleA | ModuleB): any{
    console.log(params.offset);
}
The joint declaration in

TypeScript,
in this case, throws an error to the effect that ModuleA does not have an attribute of offset .
how to solve this problem

Node.js typescript
Mar.16,2021

in your code params can be ModuleA or ModuleB type. If you pass in a ModuleA type, there is no params.offset attribute, so it fails the check (which is why you use TypeScript), so you report an error, no doubt.

< hr >

Plan 1:

you can take a look at User-Defined Type Guards

. 
interface ModuleA{
    width: number;
    height: number;
}

interface ModuleB{
    width: number;
    offset: number;
}
function isModuleA(param: ModuleA | ModuleB): param is ModuleA {
    return (<ModuleA>param).height !== undefined;
}

function test(params: ModuleA | ModuleB): any{
    if(isModuleA(params)){
    console.log(params.height);
    }else{
    console.log(params.offset);
    }
}
const foo:ModuleA={width:3,height:0};
test(foo);

scenario 2

of course, you can also add an optional offset attribute to ModuleA.

Previous: When the ztree data is initialized, all the child nodes are selected, but the parent node is not selected?

Next: The vue child component modifies the value of the parent component

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu