Question

有没有一种方法可以使用扩展运算符来缩短此时间，因此不必一遍又一遍地调用createtab函数。特别是在我的导航栏更大更深的情况下？

dfAll = (
    df1
    .withColumnRenamed('order_date', 'date')
    .join(df2, 
        ['date', 'accountnr'], 
        how = 'left')
)

Answer 1

您可以将数组中的所有页面发送到createTab

   function NavTabs(props) {
      return (
        <ul className="nav nav-tabs">
             {createTab(["Home", "About","Blog","Contact"]  , props)}
      </ul>
      );
  };

在createTab函数中，使用pages数组并渲染li元素

  function createTab(pages, props) {
       return pages.map((page, index) => (
               <li key={"Key-"+index} className="nav-item">
                   <a href={"#" + page} onClick={() => props.handlePageChange(page)} className={"nav-link" + (props.currentPage === page? " active" : "")}>
                      {page}
                   </a>
              </li>))
          };

Answer 2

您可以将“标签”放入数组中，然后调用map从中创建组件

function NavTabs(props) {
  const tabs = ['Home', 'About', 'Blog', 'Contact'];
  return (
    <ul className="nav nav-tabs">
      {tabs.map(t => createTab(t, props))}
    </ul>
  );
};

Answer 3

您可以执行类似["Home","About","Blog"].map(tab => createTab(tab, props))

的操作

   return (
    <ul className="nav nav-tabs">
     {["Home","About","Blog"].map(tab => createTab(tab, props))}
    </ul>
   )

使用扩展运算符的调用函数

3 个答案: