I have a .js file containing the code for a context menù component:

const ContextMenuDialog = (props) => {

    //  my state declaration, other const, etc...
                
                
                
    const build_ITEMS_ContextMenu = () => {

            const A = [
                      {
                        key: "0",
                        label: "AA123BB",
                        disabled: true
                      },
                      {
                        key: "1",
                        label: "Show"
                      },
                      {
                        key: "2",
                        label: "Edit"
                      },
                      {
                        key: "3",
                        label: "Save"
                      }
                    ];

            return A;        
         
    };



    return (
        <div>
            {loading ? (
              "Loading"
            ) : (
                <Menu
                    title="Menu right click"
                    style={{ top: 10, left: 10  }}
                    onClick={my_onClick_function}
                    items={ build_ITEMS_ContextMenu }
                />
            )}
        </div>
    )
    

}

export default ContextMenuDialog;
    

Just consider that I cannot simply past the code of const A directly inside the "items" element; if I do it,the code works properly. In the real life I need to build the const A with a my algorithm. This code doesn't work, the context menù is not shown!

How can I solve this problem?

CodePudding user response：

the problem is that you are not calling the function. try this items={ build_ITEMS_ContextMenu() }