2

我是新手,正在使用 react 和 reactstrap 创建一个表格。试图找到一个参考来构建一个表,该表对表中的每一行都有一些功能。运气不太好。

我的初始代码是:

import React from 'react';
import {
  Media,
  Button,
} from 'reactstrap';
import PropTypes from 'prop-types';

const UserPreview = ({user}) => (
  <tr className="user">
    <td>
      <Media>
        <img
          alt={`${user.name} avatar`}
          className="avatar d-flex mr-3"
          src={user.url} />
        <Media body>{user.name}</Media>
      </Media>
    </td>
    <td>admin</td>
    <td className='flex justify-between'>
      <Button>Update</Button>
      <Button>Delete</Button>
      <Button>Cancel</Button>
    </td>
  </tr>
);

UserPreview.propTypes = {
  user: PropTypes.shape({
    name: PropTypes.string,
    // TODO: add an url proptype.
    url: PropTypes.string,
  }).isRequired,
};

export default UserPreview;

希望你们中的一些人可以指出我可以找到一个工作表的位置,该工作表具有编辑、删除等功能。表中的每一行都有功能。

4

0 回答 0