Question

我有一个名为Spot.jsx的React组件，如下所示：

const Spot = ({title, toolber, onClick}) => {

//a lot of code written here

}

Spot.propTypes = {
    title: PropTypes.string,
    toolber: PropTypes.shape(),
    onClick: PropTypes.func,
}

我在另一个组件中使用这个组件：

...
<Spot 
  title={account.AccountName}
  onClick={() => "mySite/accountoverview?id=" + account.AccountId}
    ...
>
...
</Spot>

问题在于链接，当我将鼠标悬停在它上面时，它应该是彩色的，但是当我点击它时它什么也没做。

此外，控制台为空，没有错误

你有什么建议可以解决这个问题吗？

Answer 1

onClick组件的Spot道具需要是一个函数。如果您打算将该字符串作为网址打开，我建议将AccountId作为道具传递并杀死onClick。然后在你的Spot内进行：

const Spot = ({title, toolber, AccountId}) => { return <a href={ `mySite/accountoverview?id=${AccountId}` }>{ title }</a>; }

并像这样使用它：

<Spot title={account.AccountName} AccountId={account.AccountId} />

如何调用onClick函数将一个组件转换为另一个组件的渲染

1 个答案: