Question

我有两个我要扩展的打字稿界面，它们都有一个不兼容的classes字段。

接口'Props'不能同时扩展类型'{ innerRef ?:（（instance：any）=> void）| RefObject |空|未定义}”和“ TypographyProps”。类型为“ {classes：记录； innerRef ?:（（instance：any）=> void）| RefObject |空|未定义}”和“ TypographyProps”不同。

我该如何扩展这些内容？我可以选择其中之一，还是可以重命名其中之一？

interface Props extends WithStyles<typeof styles>, TypographyProps {
   children: string;
}

Answer 1

TypeScript允许使用称为Mixins的功能，该功能看起来与您的基本工作相似。这将允许您访问多个类。但是，必须在两个地方创建定义。如您所见，import com.digitalasset.ledger.api.v1.ValueOuterClass; import static java.util.AbstractMap.SimpleImmutableEntry; import java.util.List; import java.util.function.Function; import java.util.stream.Collectors; public class Demo { static SimpleImmutableEntry<ValueOuterClass.RecordField, ValueOuterClass.RecordField> EntryFromTuple(ValueOuterClass.Record tupleRecord) { return new SimpleImmutableEntry<>(tupleRecord.getFields(0), tupleRecord.getFields(1)); } static class SimpleImmutableEntryMap<S, T, U, V> implements Function<SimpleImmutableEntry<S, T>, SimpleImmutableEntry<U, V>> { Function<S, U> mapFst; Function<T, V> mapSnd; public SimpleImmutableEntryMap(Function<S, U> mapFst, Function<T, V> mapSnd) { this.mapFst = mapFst; this.mapSnd = mapSnd; } @Override public SimpleImmutableEntry<U, V> apply(SimpleImmutableEntry<S, T> stEntry) { return new SimpleImmutableEntry<> (mapFst.apply(stEntry.getKey()), mapSnd.apply(stEntry.getValue())); } } static List<SimpleImmutableEntry<Long, String>> mapTuple(ValueOuterClass.Value v) { return v.getList().getElementsList().stream() .map(ValueOuterClass.Value::getRecord) .map(Demo::EntryFromTuple) .map(new SimpleImmutableEntryMap<>(ValueOuterClass.RecordField::getValue, ValueOuterClass.RecordField::getValue)) .map(new SimpleImmutableEntryMap<>(ValueOuterClass.Value::getInt64, ValueOuterClass.Value::getText)) .collect(Collectors.toList()); } }实现了c和a，并且必须同时定义两者中的所有类型，但是在b中，我们不需要向功能仅是名称和返回类型。

然后需要创建mixin（从文档中可以看到）

class a {
    public ax: number
}

class b {
    public bx: string
    public by(): void{
        console.log('by()')
    }
}

class c implements a, b { 
    public ax: number = 123
    public bx: string = 'hello'
    public by: () => void
}

从文档中

这将遍历每个mixins的属性，并将它们复制到mixins的目标，并用其实现填充替代属性。

applyMixins(c, [a, b])

let myobj = new c()
myobj.by()

Typescript：如何扩展具有相同字段的接口

1 个答案: