搜索不适用于材料表中的链接文本

问题描述

下面是我的代码：

const data = [];
Object.keys(json).forEach(key => {
    const jobStr = json[key];
    console.log(`=== historicalJobCallback jobStr: ${jobStr}`);

    const jobItem = jobStr.split(',');
    data.push({
        jobId: <a href={Utils.getLungoEndpoint() + jobItem[0]} target="_blank" rel="noopener noreferrer"
                  className={classes.link}>{jobItem[0]}</a>,jobName: jobItem[1],submittedBy: jobItem[2],submittedTime: jobItem[3],tenant: jobItem[4],business: jobItem[5]
    })
});

setState({
    columns: [
        {
            title: 'Job ID',field: 'jobId',render: rowData => <a href={Utils.getLungoEndpoint() + jobItem[0]} target="_blank"
                                  className={classes.link}>{jobItem[0]}</a>
        },{title: 'Job Name',field: 'jobName'},{title: 'Submitted By',field: 'submittedBy'},{title: 'Submitted Time',field: 'submittedTime'},{title: 'Tenant',field: 'tenant'},{title: 'Business',field: 'business'},],data: data
});

您可以看到jobId列是一个链接，搜索功能适用于job ID列以外的其他列，我怀疑是由于job id文本包裹在链接中，我如何使其可搜索？

解决方法

感谢@Yatrix的建议，使我的代码如下所示，搜索现在可用于链接：

Object.keys(json).forEach(key => {
    const jobItem = json[key].split(',');
    data.push({
        jobId: {
            name: jobItem[0],url: Utils.getLungoEndpoint() + jobItem[0]
        },jobName: jobItem[1],submittedBy: jobItem[2],submittedTime: jobItem[3],tenant: jobItem[4],business: jobItem[5]
    })
});
console.log(`=== historicalJobCallback data: ${JSON.stringify(data)}`);

setState({
    columns: [
        {
            title: 'Job ID',field: 'jobId',customFilterAndSearch: (term,rowData) => (rowData.jobId.name).indexOf(term) != -1,render: rowData => <Link href={rowData.jobId.url} target='_blank'
                                     color='secondary'>{rowData.jobId.name}</Link>
        },{title: 'Job Name',field: 'jobName'},{title: 'Submitted By',field: 'submittedBy'},{title: 'Submitted Time',field: 'submittedTime'},{title: 'Tenant',field: 'tenant'},{title: 'Business',field: 'business'},],data: data
});