Javascript 如何设计<；链接>；使用样式化组件

我在我的打字脚本代码中使用了来自

@material ui/core/Link

的

链接，它工作得非常好：

<Link href="#" variant="body2">
  Forgot?
</Link>

以及：

<StyledLink>Forgot?</StyledLink>

忘了？

但是我在
className
和
children
上不断得到错误，
绑定元素'children'隐式地具有'any'类型。ts（7031
但是即使我添加了
any
，它也不起作用

在这种情况下，使用样式化组件的正确方法是什么？或者js中的任何其他
css
替代方法？
您应该使您的
链接
组件如下所示：

// Link.js
import { Link } from '@material-ui/core/Link';
import styled from 'styled-components';

export default styled(Link)`
  display: block;
  color: #F51963;
  text-decoration: none;
`;

例如，您可以在其他div或按钮上使用

忘记了？

然后，您可以做两件事来设置按钮/div的样式

忘记了？

或者第二个是导入一个单独的css文件

import classes from './ComponentName.module.css'

然后给出一种风格

忘记？
此代码有效，并且不会从typescript编译器获得任何警告

从“样式化组件”导入样式化；
常量链接=({
类名，
儿童
}: {
只读类名：string；
只读子级：React.ReactElement；
}) => (
);
export const StyledLink=styled（链接）`
href:#；
变体：body2；
颜色：红色；
`;
函数App（）{
返回(
忘记？
);
}
我如何通过它传递一个实际的网站链接？我尝试了
忘记密码？
，但它不起作用。无需担心。如果我在样式列表中添加
href:#
，它会起作用。你知道这个在这里代表什么吗？亲爱的@Jnl，传递
href
只需将你的自定义
链接导入你想使用的地方，然后像
sampleText
那样编写。它应该可以工作，并且不需要在样式中传递
href:#
，因为它不是有效的CSS属性名。有关更多信息，请将您的重新制作上传到CodeSandBox，我肯定会看到您的代码和堆栈。这里的
href:#
到底意味着什么？我知道我试图在这里使用接受的答案，但如果我通过
href={www.hello.com}
在我的
StyledLink
组件中，它不起作用。但是，如果我在样式列表中添加
href:#
，它会起作用。如果你想链接到一个站点，你应该更改上面的href，例如
我等待你的第二个问题重新生成或另一个堆栈溢出问题。但现在我留下一个向上的投票。+1
import classes from './ComponentName.module.css'