$.ajax({ method: "POST", url: "../d/detail/keyInfo", data: { custId: custId }, success: function(result) { var jsonRes = JSON.parse(result); for (const item of jsonRes) { if (item.code === 'customerInfo...-DPDK中文网

要在 item.code === 'loan' 部分添加 “全部”、”已结清”、”停催” 和 “诉讼” 这三个 Tabs，你需要进行以下步骤：

定义 Tabs 的数据结构：可以创建一个对象或数组来存储这几个 Tab 的信息。
筛选显示的贷款信息：根据 Tab 的选择，筛选出相应的贷款数据。
渲染 Tabs 和内容：将 Tabs 渲染到页面上，并在切换时更新显示的数据。

下面是一个简化的示例，演示如何实现这一过程。请根据你的实际需求和框架（例如 Vue.js、React 等）进行调整。

示例代码

// 假设这些状态用于标识不同类型的贷款
const loanTabs = [
    { code: 'all', label: '全部' },
    { code: 'settled', label: '已结清' },
    { code: 'stopCollection', label: '停催' },
    { code: 'litigation', label: '诉讼' }
];
// 初始选择的 Tab
let selectedTab = loanTabs[0].code; // 默认选择 "全部"
// 修改 AJAX 请求成功后的处理逻辑
success: function(result) {
    var jsonRes = JSON.parse(result);
    
    let loansData = []; // 存储所有贷款数据
    for (const item of jsonRes) {
        if (item.code === 'loan') {
            for (const loan of item.child) {
                loansData.push(loan); // 收集所有贷款信息
                // ...原有处理逻辑...
            }
        }
    }
    // 筛选显示数据
    const filteredLoans = loansData.filter(loan => {
        switch (selectedTab) {
            case 'all':
                return true; // 全部显示
            case 'settled':
                return loan.status === 'settled'; // 根据实际字段判断是否已结清
            case 'stopCollection':
                return loan.status === 'stop'; // 停催的状态判断
            case 'litigation':
                return loan.status === 'litigation'; // 诉讼状态判断
            default:
                return true;
        }
    });
    me.loanData = filteredLoans; // 更新当前显示的数据
    
    me.form.initForm(jsonRes);
}
// 在某个地方渲染 tabs，可以使用 DOM 操作或前端框架的方法
function renderTabs() {
    const tabsContainer = document.getElementById('tabs'); // 获取 Tabs 容器
    
    loanTabs.forEach(tab => {
        const tabElement = document.createElement('button');
        tabElement.innerText = tab.label;
        
        tabElement.onclick = () => {
            selectedTab = tab.code; 
            renderLoans(); // 重新渲染对应 Tab 下的贷款信息
        };
        
        tabsContainer.appendChild(tabElement);
    });
}
// 渲染过滤后的贷款列表的函数（假设存在这个方法）
function renderLoans() {
    const loansListContainer = document.getElementById('loans-list'); 
    loansListContainer.innerHTML = ''; 
    me.loanData.forEach(loan => {
        const loanItem = document.createElement('div');
        loanItem.innerText = `合同号: ${loan.contractCode}, 状态: ${loan.status}`; 
        loansListContainer.appendChild(loanItem); 
    });
}
// 初始化 Tabs 渲染
renderTabs();

注意事项：

确保根据你的具体需求调整过滤条件，如 status 字段及其值等。
上述代码只是一个简单示例，具体实现可能需要更复杂的错误处理和 UI 更新机制。
如果你使用了前端框架（如 React、Vue等），建议使用它们提供的数据绑定和组件化方式来管理状态和 UI 更新。

内容由零声教学AI助手提供，问题来源于学员提问