導讀
如果在使用ref
時候遇上下面錯誤可以讀一讀
錯誤1
RefObject<PureComponent<{}, {}, any>>”分配給類型“LegacyRef<GroupModal>
錯誤2
'GroupModal' refers to a value, but is being used as a type here.ts
正文
問題一
import GroupModal from './component/groupModal/groupModal';
class CardManagerPage extends React.PureComponent<CardManagerProps, CardManagerState> {
private groupModal: React.RefObject<React.PureComponent>;
public constructor(props: CardManagerProps) {
this.groupModal = React.createRef();
}
public render() {
return <GroupModal ref={this.groupModal} />
}
}
會報一長串錯誤恶耽,主要是
RefObject<PureComponent<{}, {}, any>>”分配給類型“LegacyRef<GroupModal>
只要 private groupModal: React.RefObject<GroupModal>;
就可以解決
這時候public
還是private
的價值就體現(xiàn)出來了遗契。
問題2
考慮到component
下不止一個組件鸠姨,我想在index.ts
統(tǒng)一導出疹尾,代碼如下
import GroupModal from './groupModal/groupModal';
export default {
GroupModal,
};
使用時
import { GroupModal } from './component';
就會報如下錯誤
'GroupModal' refers to a value, but is being used as a type here.ts
我粗魯?shù)姆g一下诸尽,這里需要一個類型但是你給了他一個值焦蘑。
我嘗試正面解決這個問題拾给,此處省略1萬字
只要在index.tsx
這樣寫就可以
export { default as GroupModal } from './groupModal/groupModal';
最終結(jié)果
export { default as GroupModal } from './groupModal/groupModal';
import { GroupModal } from './component';
class CardManagerPage extends React.PureComponent<CardManagerProps, CardManagerState> {
private groupModal: React.RefObject<GroupModal >;
public constructor(props: CardManagerProps) {
this.groupModal = React.createRef();
}
public render() {
return <GroupModal ref={this.groupModal} />
}