英文:
Function is missing in type but required in type 'Props'
问题
Here's the translated code:
我正在将一个函数传递给我的 `MapComponent`：
type Props = {
results: SearchResult[];
...
onDirectionsPress: (
latitude: number,
longitude: number,
sitename: string,
) => void;
};
const MapTab = ({
results,
fuelType,
searchDistance,
addressName,
onDirectionsPress,
}: Props) => (
<View style={styles.container}>
...
<MapComponent results={results} {...onDirectionsPress} />
</View>
);
在我的 `MapComponent` 中，它显示为 `undefined`，并且在 TypeScript 中出现了上述错误，我如何将我的函数传递给 `MapComponent`？
type Props = {
results: SearchResult[];
onDirectionsPress: (
latitude: number,
longitude: number,
sitename: string,
) => void;
};
const MapComponent = ({ results, onDirectionsPress }: Props) => {
console.log('here', results, onDirectionsPress); <<< undefined
return (
<View style={styles.container}>
<MapView
ref={mapRef}
minZoomLevel={2} // 默认值 => 0
maxZoomLevel={15}
provider={PROVIDER_GOOGLE}
style={styles.map}>
{Markers}
</MapView>
{showCard && <SearchResultCard {...resultProps} />}
</View>
);
};
export default MapComponent;
I've translated the code as requested.
英文:
I am passing a function to my MapComponent:
type Props = {
results: SearchResult[];
...
onDirectionsPress: (
latitude: number,
longitude: number,
sitename: string,
) => void;
};
const MapTab = ({
results,
fuelType,
searchDistance,
addressName,
onDirectionsPress,
}: Props) => (
<View style={styles.container}>
...
<MapComponent results={results} {...onDirectionsPress} />
</View>
);
In my MapComponent, it is appearing as undefined, with the above error in TypeScript, How can I pass my function into my MapComponent?
type Props = {
results: SearchResult[];
onDirectionsPress: (
latitude: number,
longitude: number,
sitename: string,
) => void;
};
const MapComponent = ({ results, onDirectionsPress }: Props) => {
console.log('here', results, onDirectionsPress); <<< undefined
return (
<View style={styles.container}>
<MapView
ref={mapRef}
minZoomLevel={2} // default => 0
maxZoomLevel={15}
provider={PROVIDER_GOOGLE}
style={styles.map}>
{Markers}
</MapView>
{showCard && <SearchResultCard {...resultProps} />}
</View>
);
};
export default MapComponent;
答案1
得分: 3
你应该使用onDirectionsPress={onDirectionsPress}代替{...onDirectionsPress}来传递onDirectionsPress：
<MapComponent results={results} onDirectionsPress={onDirectionsPress} />
英文:
You should be passing onDirectionsPress with onDirectionsPress={onDirectionsPress} instead of {...onDirectionsPress}:
<MapComponent results={results} onDirectionsPress={onDirectionsPress} />
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论