React js在单击按钮时获取表数据

React.js是一个用于构建用户界面的JavaScript库。它通过组件化的方式，将用户界面拆分成独立的可复用部分，使得开发者可以更加高效地构建交互式的Web应用程序。

要在React.js中实现在单击按钮时获取表数据，可以按照以下步骤进行操作：

创建一个React组件，用于渲染包含表格和按钮的界面。可以使用React的useState钩子来定义一个状态变量，用于存储表数据。

import React, { useState } from 'react';

const TableData = () => {
  const [data, setData] = useState([]);

  const fetchData = () => {
    // 在这里编写获取表数据的逻辑，可以通过AJAX请求、API调用等方式获取数据，并将数据更新到状态变量中
    // 示例代码：
    // const response = await fetch('https://api.example.com/tabledata');
    // const data = await response.json();
    // setData(data);
  };

  return (
    <div>
      <table>
        {/* 在这里渲染表格数据 */}
      </table>
      <button onClick={fetchData}>获取表数据</button>
    </div>
  );
};

export default TableData;

在fetchData函数中编写获取表数据的逻辑。可以使用AJAX请求、API调用等方式从服务器获取数据，并将数据更新到状态变量中。示例代码中使用了fetch函数进行AJAX请求，并将获取到的数据更新到data状态变量中。
在组件的渲染函数中，将表格数据渲染到表格中。可以使用JavaScript的map函数遍历数据数组，并将每个数据项渲染为表格的一行。

这样，当用户点击按钮时，fetchData函数会被调用，从服务器获取表数据并更新到状态变量中，最终导致界面重新渲染，显示最新的表格数据。

关于React.js的更多信息和学习资源，可以参考腾讯云的React.js产品介绍页面：React.js产品介绍