【问题标题】:react-bootstrap-table2 search is not working on formatted cellsreact-bootstrap-table2 搜索不适用于格式化单元格
【发布时间】:2020-10-20 03:55:49
【问题描述】:

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

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,
  },
];

我有一个客户格式化程序,它返回一个带有文本的锚标记。搜索无法解决此问题。

我看了文档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
}

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

【问题讨论】:

    标签: reactjs bootstrap-table react-bootstrap-table


    【解决方案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),
      },
    ];
    

    【讨论】:

      【解决方案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',
        }
      ];
      

      一周后没有任何效果。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-10-09
        相关资源
        最近更新 更多