CoreUI React.js 管理模板 [CDataTable] 过滤嵌套对象

问题描述

我正在使用 COREUI 管理 React.js 模板。试图过滤搜索字段中的嵌套对象，但无法这样做。谁能告诉我如何过滤 CDataTable 组件中的嵌套对象。

////从API中获取数据

const [imports,setImports] = useState([]);


useEffect(() => {
    let mounted = true;
    getImports()
      .then(items => {
        if (mounted) {
          setImports(items)
        }
      })
    return () => mounted = false;
  },[])

////字段

const fields = [
  { key: 'id',label:'Contract ID',_style: { width: '5%' },_classes: 'font-weight-bold' },{ key: 'productName',_style: { width: '15%' },{ key: 'totalPrice',label:'Price',{ key: 'quantity',_style: { width: '3%' },{ key: 'shipmentDate',_style: { width: '12%' },{ key: 'arrivalDate',{ key: 'paymentTerm',_style: { width: '10%' },{ key: 'status',_style: { width: '6%' },]

////表格组件

 <CDataTable
          items={imports}
          fields={fields}
           columnFilter
           tableFilter={{
            placeholder: "Filter",label: "Search:",}}
          itemsPerPageSelect
          itemsPerPage={5}
          hover
          sorter
          pagination
          striped
          clickableRows
          activePage={page}
          onRowClick={(item) => history.push(`/imports/importproductdetails/${item.id}`)}
          scopedSlots={{
           'productName':
              (items) => (
                <td>
                 <b>{items.productDetails.productName}</b>
                </td>
              ),'shipmentDate':
              (items) => (
                <td>
                 <b>{items.shipmentDetails.shipDate}</b>
                </td>
              ),}}
        />

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）