DataTables中draw()与ajax.reload()方法的区别是什么？

问题描述 #

我在开启serverSide并通过Ajax获取数据的DataTables中，一直使用draw()方法重载表格。最近发现了ajax.reload()方法，但从官方文档中无法明确二者的区别。在如下配置的表格中测试后，二者表现似乎完全一致：

myTable = new DataTable("#myTable", {
    serverSide: true,
    ajax: {
        url: "/get_data/",
        // addAjaxData adds data from a form or from history.state to data
        data: function(data) { addAjaxData(data); },
    },
    // other options
});

请问在这类配置的表格中，draw()和ajax.reload()的区别是什么？

核心区别说明 #

1. 行为本质不同 #

• draw()：核心是重新渲染表格，不一定会发起新Ajax请求。在非服务端模式下，它只会用现有客户端数据重绘表格；但在你的服务端模式配置中，DataTables默认会在draw()时携带当前分页、排序、筛选参数请求服务端，所以看起来和ajax.reload()效果一致。
• ajax.reload()：核心是强制发起新Ajax请求拉取数据，拿到新数据后再重新渲染表格。不管当前数据状态如何，它都会主动去服务端获取最新数据。

2. 参数与控制逻辑不同 #

• draw()：支持传入布尔值控制分页重置——draw(false)保持当前页码，draw(true)回到第一页。它的逻辑是先确定渲染规则，再根据模式决定是否请求数据。
• ajax.reload()：第一个参数是请求完成后的回调函数，第二个布尔参数控制分页重置（true重置到第一页，false保留当前页）。它的逻辑是先完成数据刷新，再执行表格渲染。

3. 适用场景不同 #

• 用draw()：当你只是调整表格UI状态（比如显示/隐藏列、切换排序方式），或者确认服务端数据无更新，仅需重绘现有数据时更合适。
• 用ajax.reload()：当你明确服务端数据已更新（比如用户提交了修改、删除操作），需要强制拉取最新数据时，这个方法更直接。

补充说明 #

在你当前的服务端模式下，两者表现相似是因为服务端模式的draw()会自动触发Ajax请求；但如果切换到客户端模式，draw()只会重绘本地数据，不会发请求，而ajax.reload()仍会主动拉取新数据，此时二者的差异会非常明显。

内容的提问来源于stack exchange，提问作者bur