Javascript 在gatsby中显示具有布尔值的组件

我有这个警报组件，我希望它只在我从标记后文件（在frontmatter字段中）传递真值时显示

从“React”导入React
从“react bootstrap”导入{Toast，ToastBody}
函数警报（{子级，警报}）{
返回(
{儿童}
)
}
alert.defaultProps={
警报：“警报黄色”
};
导出默认警报

{条件和警告}
//或在警报组件定义中
函数警报（{cond}）{
如果（cond）返回警报
否则返回空值
}

如何从.md文件将值传递到内部花括号中？我尝试将属性作为简单字符串（颜色和文本）传递，但它不适用于布尔值。像这样第二个很好，第一个没有。

<div>{condition && <Alert>Warning</Alert>}</div>

// OR in alert component definition 

function Alert({cond}) {
  if (cond) return <div>Alert</div>
  else return null
}