如何在点击按钮上添加课程?

时间:2020-12-24 23:00:21

How can I add a class on a clicked button? Do I need to make it into a class or can I add a state on a constant? I have tried to make a handleclick function but I don't seem to be able to fire initialstate on a constant.

如何在单击的按钮上添加课程?我需要将它变成一个类,还是可以在常量上添加一个状态?我试图创建一个handleclick函数,但我似乎无法在常量上触发initialstate。

const CaseListItem = ({ currentCase, onCaseSelect }) => {
console.log(currentCase);
  return (
   <div>
     <button onClick={() => onCaseSelect(currentCase)} className={currentCase.color} />
     <div className="media-heading"> {currentCase.title} </div>
   </div>
);
};

1 个解决方案

#1


1  

I think that in such case you should use component with state and update state color name property on click - this will re-render your component and you will be able to use state propery as class name. You can also keep this component stateless but in such case parent component should have state that will be updated when child component (CaseListItem) is clicked and then you can pass state color property as prop to CaseListItem component

我认为在这种情况下你应该使用带有状态的组件并在点击时更新状态颜色名称属性 - 这将重新渲染你的组件,你将能够使用状态属性作为类名。您还可以保持此组件无状态,但在这种情况下,父组件应具有在单击子组件(CaseListItem)时将更新的状态,然后您可以将状态颜色属性作为prop传递给CaseListItem组件

#1


1  

I think that in such case you should use component with state and update state color name property on click - this will re-render your component and you will be able to use state propery as class name. You can also keep this component stateless but in such case parent component should have state that will be updated when child component (CaseListItem) is clicked and then you can pass state color property as prop to CaseListItem component

我认为在这种情况下你应该使用带有状态的组件并在点击时更新状态颜色名称属性 - 这将重新渲染你的组件,你将能够使用状态属性作为类名。您还可以保持此组件无状态,但在这种情况下,父组件应具有在单击子组件(CaseListItem)时将更新的状态,然后您可以将状态颜色属性作为prop传递给CaseListItem组件