可以将 lastButton
和 nextButton
的点击事件提取出来,封装成一个新的方法,然后在 getContactInfoGridSettings
函数中调用这个方法。这样可以使代码更加模块化,也方便后续维护和测试。
下面是修改后的示例代码:
ggNamespace.functions.WorkPage.getContactInfoGridSettings = function() {
const me = this;
let table = me.poolsPage.tasksListGrid.dataTable;
let allData = table.rows().data().toArray();
let currentIndex = 0;
// 定义更新显示的函数
const updateDisplay = function() {
// 在这里处理当前索引的数据更新逻辑,比如更新视图或显示信息等
console.log('Current Data:', allData[currentIndex]);
// 可以添加其他逻辑来更新UI
};
// 提取出按钮点击事件的处理逻辑
const handleButtonClick = function(isNext) {
if (isNext) {
if (currentIndex < allData.length - 1) {
currentIndex++;
} else {
currentIndex = 0;
}
} else {
if (currentIndex > 0) {
currentIndex--;
} else {
currentIndex = allData.length - 1;
}
}
updateDisplay();
};
// 设置 lastButton 的点击事件处理器
me.lastButton.addClickHandler(function() {
handleButtonClick(false); // false 表示点击的是上一个按钮
});
// 设置 nextButton 的点击事件处理器
me.nextButton.addClickHandler(function() {
handleButtonClick(true); // true 表示点击的是下一个按钮
});
const columns = [];
let settings = {
columns: columns,
processing: true,
serverSide: true,
ajax: {
url: '../d/detail/contacts',
contentType: 'application/json',
type: 'POST',
complete: function() {}
}
};
return settings;
};
修改说明:
- 将重复的按钮点击逻辑提取到
handleButtonClick
函数中,该函数接受一个布尔值参数,用于判断是“上一个”还是“下一个”。 - 调用
updateDisplay()
来更新当前索引对应的数据展示。 - 保持原有的 AJAX 设置不变,可以正常联调接口。
这样的重构使得代码更清晰、更易于管理。如果需要对按钮行为进行更多修改,可以集中在 handleButtonClick
方法中进行调整。
内容由零声教学AI助手提供,问题来源于学员提问