javascript 未找到客户时显示消息[已关闭]

2nc8po8w  于 2023-04-28  发布在  Java
关注(0)|答案(1)|浏览(179)

已关闭,此问题需要details or clarity。目前不接受答复。
**想改善这个问题吗?**通过editing this post添加详细信息并澄清问题。

昨天关门了。
Improve this question
我想在尝试搜索不存在的客户时显示“未找到”文本。

Customers.jsx

import { getAllCustomers, reset } from "../../../../features/customers/customerSlice";
import Search from "./Search";

const Customers = ({ title, captions, isLoading }) => {;

  const dispatch = useDispatch();
  const navigate = useNavigate();
  
  const { customers, isError, message, meta } = useSelector(
    (store) => store.customer
  );
  
  return (
    <Table variant="simple" color={textColor}>
        <Tbody>
           {customers.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((customers) => {
           return (
            <CustomersTable
              key={customers.uid}
              name={`${customers.first_name} ${customers.last_name}`}
              logo={customers.logo}
              id={customers.uid}
              exchange={customers.exchange}
  )
qij5mzcb

qij5mzcb1#

如果找不到客户,可以使用三元运算符。但首先你必须检查顾客的长度。
这是三元运算符的示例用法

customers.length > 0 ? <TableComponent /> : <div>Customer Not Found</div>

因此您可以像这样在代码中实现

import { getAllCustomers, reset } from "../../../../features/customers/customerSlice";
import Search from "./Search";

const Customers = ({ title, captions, isLoading }) => {

  const dispatch = useDispatch();
  const navigate = useNavigate();
  
  const { customers, isError, message, meta } = useSelector(
    (store) => store.customer
  );
  
  return (
    <Table variant="simple" color={textColor}>
        <Tbody>
           {
                customers.length > 0 ?
                customers.slice(page * rowsPerPage, page * rowsPerPage + 
                rowsPerPage).map((customers) => {
                return (
                <CustomersTable
                    key={customers.uid}
                    name={`${customers.first_name} ${customers.last_name}`}
                    logo={customers.logo}
                    id={customers.uid}
                    exchange={customers.exchange} />
                   ) 
                } 
                : <div> Customer not found </div>
           }
        </Tbody>
    </Table>
  )

相关问题