Update snippet formatting

This commit is contained in:
Isabelle Viktoria Maciohsek
2020-09-06 14:20:45 +03:00
parent f384fc0ee3
commit 95746a843b
18 changed files with 60 additions and 71 deletions

View File

@ -7,13 +7,13 @@ Renders a table with rows dynamically created from an array of objects and a lis
- Use `Object.keys()`, `Array.prototype.filter()`, `Array.prototype.includes()` and `Array.prototype.reduce()` to produce a `filteredData` array, containing all objects with the keys specified in `propertyNames`.
- Render a `<table>` element with a set of columns equal to the amount of values in `propertyNames`.
- Use `Array.prototype.map` to render each value in the `propertyNames` array as a `<th>` element.
- Use `Array.prototype.map` to render each object in the `filteredData` array as a `<tr>` element, containing a `<td>` for each key in the object.
- Use `Array.prototype.map()` to render each value in the `propertyNames` array as a `<th>` element.
- Use `Array.prototype.map()` to render each object in the `filteredData` array as a `<tr>` element, containing a `<td>` for each key in the object.
_This component does not work with nested objects and will break if there are nested objects inside any of the properties specified in `propertyNames`_
```jsx
function MappedTable({ data, propertyNames }) {
const MappedTable = ({ data, propertyNames }) => {
let filteredData = data.map(v =>
Object.keys(v)
.filter(k => propertyNames.includes(k))
@ -39,7 +39,7 @@ function MappedTable({ data, propertyNames }) {
</tbody>
</table>
);
}
};
```
```jsx