react-bootstrap-table2 搜索不适用于格式化单元格

Question

我需要有关将格式化数据纳入搜索功能的帮助。由于某种原因，格式化链接未包含在搜索中

function docFormatter(cell, row, rowIndex) {
  return (
    <a href={${row.doc.doclink}}>
       {row.doc.docname}

    );
  }

const columns = [
  { dataField: "sno", text: "S.No" },
  {
    dataField: "doc",
    text: "Document Name",
    formatter: docFormatter,
    filterValue: docFormatter,
  },
];

我有一个客户格式化程序，returns 一个带有文本的锚标记。搜索对此无效。

我看了文档https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/basic-search.html#search-on-formatted-data

..., {
  dataField: 'type',
  text: 'Job Type',
  formatter: (cell, row) => types[cell],
  filterValue: (cell, row) => types[cell] // we will search the value after filterValue called
}

我不明白如何通过引用来实现它。请帮我解决这个问题。谢谢

Answer 1

这是修复此问题的工作模型

function docFormatter(cell, row, rowIndex) {
  return (
    <a href={${row.doc.doclink}}>
       {row.doc.docname}

    );
  }

function docFormatterFilter(cell, row) {
  return cell.docname;
}

const columns = [
  { dataField: "sno", text: "S.No" },
  {
    dataField: "doc",
    text: "Document Name",
    formatter: docFormatter,
    filterValue: (cell, row) => docFormatterFilter(cell, row),
  },
];

Answer 2

我遇到了同样的问题，但找不到解决方案。

function docFormatterFilter(cell, row) {
  return row.nom;
}
export const fieldsUser = [
  {
    dataField: 'id',
    sort:true,
    text: '',
    formatter: (cell, row) => {
      return (
      <div className={`flex-grow-1`}>
        <div className="d-flex align-items-center justify-content-between">
          <h4 className="m-0">{row.nom}</h4>
          <small className={ `role-groupe text-center ${row.role==='s' ? 'bg-danger' : row.role==='a'?'bg-success':'bg-primary'}` }>{row.role_label}</small>
        </div>
      </div>
    )},
    filterValue: (cell, row) => docFormatterFilter(cell, row),
    filter: textFilter({
      caseSensitive: false,
      comparator: Comparator.LIKE,
    }),
    classes: 'col-12',
  }
];

一个星期以来没有任何效果。

react-bootstrap-table2 搜索不适用于格式化单元格

react-bootstrap-table2 search is not working on formatted cells

reactjs

bootstrap-table

react-bootstrap-table