Question

我正在将Antd下拉菜单组件与JSON结合使用，我想创建一个动态菜单，该菜单根据我的JSON（我正在使用express获取）进行更改

到目前为止我有

const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp(functions.config().firebase);
//const firestore= admin.firestore();
//const setting ={timestampInSnapshots:true};
// firebase.setting(setting);
const stripe = require('stripe')(functions.config().stripe.testkey)
exports.addStripeSource =functions.firestore.document('cards/{userid}/Tokens/{tokenid}}')
.onCreate(async (tokenSnap, context)=> {
   var customer;
   const data=tokenSnap.aftter.data();
   if(data == null){
       return null;
   }
   const token =data.tokenId;
   const snapshot =await firestore.collection('cards').doc(context.params.userId).get();
   const customerId=snapshot.data().custId;
   const customerEmail=snapshot.data().Email;
   if(customerId == 'new')
   {
       customer= await stripe.customers.create({
           email: customerEmail,
           source: token,
       });
       firestore.collection('cards').doc(context.params.userId).update  ({
           custId: customer.id,
       })
   }
   else{
       customer= await stripe.customers.retrieve(customerId);
   }
   const customerSource= customer.sources.data[0];
   return firestore.collection('cards').doc(context.params.userId).collection('sources').doc(customerSource.card.fingerprint).set(customerSource)

}
)

但是这似乎不起作用，任何帮助都会很棒！

Answer 1

是Menu.Item而不是Menu.item

<Menu onClick={this.onClick}>
        {this.state.getSoftware.map((data, i) => (
          <Menu.Item key={i}>{data.Name}</Menu.Item>
        ))}
      </Menu>

Answer 2

您需要单独映射项目，然后将其推入菜单对象内。如果您要从道具中更新菜单，则可能会在渲染器中发生。

const menus = Object.entries(scenes).map((key) => {
      return (
        <Menu.Item key={key[0]} icon={<UserOutlined />}>
          {key[1].name}
        </Menu.Item>
      )
    });
const menu = () => {
      return (
        <Menu onClick={handleMenuClick}>
          {menus}
        </Menu>
      )

，然后在代码中呈现菜单：

<Dropdown overlay={menu}>
   <Button>
     Assign Navigation <DownOutlined />
   </Button>
 </Dropdown>

React Antd动态下拉菜单

2 个答案: