javascript - 无法在主页中使用自定义组件 - 打字稿错误
问题描述
我正在尝试制作一个自定义警报组件:
type Severity = "error" | "success" | "info" | "warning" | undefined;
export default function CustomAlert(severity: Severity, text: string){
return(
<Alert style={{width:'50%'}} severity={severity}> {text}</Alert>)
}
但我无法在我的主页功能中使用它:
function StatusMessage(){
if (errorMessage.includes(`Couldn't find user`)){
return (
<div>
<CustomAlert severity='error' text='User Not Found'></CustomAlert>
</div>
)
}
自定义警报给了我这个错误:
Type '{ severity: string; text: string; }' is not assignable to type '(IntrinsicAttributes & "success") | (IntrinsicAttributes & "info") | (IntrinsicAttributes & "warning") | (IntrinsicAttributes & "error")'.
Type '{ severity: string; text: string; }' is not assignable to type '"error"'.ts(2322)
解决方案
功能组件接收一个参数:props
. 您可以使用整个对象或对其进行解构,但您不能传递多个。
function CustomAlert({severity: Severity, text: string})
function CustomAlert(props: {severity: Severity, text: string})
推荐阅读
- react-native - 类型无效:需要一个字符串(对于内置组件)或一个类/函数(对于复合组件)但得到:在 react-native 中未定义
- angular - 在角度应用程序中在运行时加载 config.json 文件
- postgresql - 查询输出中的列数不同
- html - 使部分复选框文本加粗
- asp.net-mvc - MVC @Foreach 如何仅显示前 5 个
- c# - 测试中的异步代码有效但显示未运行
- scrapy - Scrapy 抓取 div 下的所有文本
- python - 如何扫描字符串中的字符以标记匹配是否正确
- python - python:瑞利拟合(直方图)
- r - 使用 lapply() 在 R 中生成 igraph 属性