css - 如何在 Prime React 中灰显动态菜单

Question

我正在填充来自后端的反应菜单。我正在使用反应路线来导航它们。我想将其中一个变灰，同时它们将填充在屏幕中。我使用了两个 css 类，一个是银行供应内容，它基本上是在进行格式化，我也在尝试应用 css disable-link 来禁用我要禁用的菜单中的指针，但它对我不起作用。下面是代码

return (
<div className="banking-supplies-content">
   <HashRouter>
    <Route 
    exact path="/retail-banking"
    />
    <Route
      exact
      path="/journal"
      component={BankingSuppliesJournalListing}
    />
    <Route exact path="/report" component={BankingSuppliesReport} />
    <Route exact path="/invoiceSearch" component={LocationInvoiceSummarySearch} />
   <div className="disable-link">
   <Route exact path="/invoiceCreate"/>
   </div>           
    {/* <Route exact path="/" component={BankingSuppliesHome} /> */}
  </HashRouter>
  <ShowSpinner showSpinner={bankingSuppliesContextReference.showSpinner} />
  
</div>
  );
};

我用过的css

.banking-supplies-content {
  margin: 20px;
}
.disable-link{
 pointer-events: none;
}

我正在使用 disable 属性将其变灰，但是它不起作用。