Him I have a component, for some reason, I can't see any variable value inside the containing <tr>
HTML tag.
between the <td>
tag I can see the variable value.
If I write <tr id={id}>
i receive the data but If I write <tr key={id}>
I get only <tr>
in the code.
The id is generated by uuid
an dis something like this 62b82703-12f5-4fe6-903c-b875aa69246a
What can be the reason for that?
this is my component:
import React, { Component } from "react";
import { Button } from "react-bootstrap";
class Course extends Component {
updatedGrade = e => {
this.props.updateCourseGrade(
Number(e.currentTarget.value),
Number(e.target.id)
);
};
render() {
const { id, courseName, courseGrade, courseType } = this.props.course;
return (
<tr key={id}>
<td>
{courseType == 0 ? "מכינה" : "אקדמי"} - {courseName} - {id}
</td>
<td>{courseGrade}</td>
<td>
<Button
onClick={this.props.removeCourse.bind(this, id)}
variant="danger"
>
הסר
</Button>
</td>
</tr>
);
}
}
const btnStyle = {
background: "#ff0000",
color: "#fff",
padding: "5px 20 px",
border: "0px"
};
export default Course;