Question:
Has anyone tried out the Menu API? I am trying to do something pretty simple (change the label of a menu item in onReady) and it’s not working. The label doesn’t change in the UI and an error shows up in the logs.
Product:
Wix Studio + Velo APIs - Trying to verify in “Preview as test site” mode
What are you trying to achieve:
I thought I’d take the Menu APIs for a test drive, and I’m not getting the results I expect. The API docs say that menuItems can be used to get and set menu items on a menu. When I try to do something very simple, like change a label on an existing menu item, nothing happens.
The docs I’m following:
Say this:
menuItems
Array
Sets or gets menu items.
This should mean that the properties are SETTABLE, and that this isn’t just a readonly object.
I also found this forum post:
That is the same problem I am facing, and I’ve tried the solution offered, which only results in an error.
What have you already tried:
I followed the suggestion in the forum post above:
- Get the menuItems array from the menu.
- Change a label.
- Set the modified menuItems array back onto the menu
let menuItems = $w('#mymenu').menuItems;
menuItems[0].label = `${menuItems[0].label} NEW`;
$w('#mymenu').menuItems = menuItems;
In the above example, I print out the contents of the menuItems after setting the labels, and I see the expected result:
Some Label NEW
After setting the new menuItems object back onto the menu, I print out the contents of the menu…but the labels are still from the ORIGINAL menuItems. And nothing changes in the UI. The menu labels are still the original label. Futhermore, there is an error in the logs:
Wix code SDK error: The menuItems parameter with the label “SubMenu Label” that is passed to the menuItems method cannot be nested at this level. Menus can be 2 levels deep.
This happens even if I simply GET the original menuItems array/object, and then immediately set it back onto the menu.
let menuItems = $w('#mymenu').menuItems;
$w('#mymenu').menuItems = menuItems;
It also happens if I set the menuItems to a literal array. As was suggested in the other forum post:
$w('#mymenu').menuItems = [
{
"label": "Some Label NEW",
"menuItems": [
{
"label": "SubMenu Label",
"menuItems": [
...
Additional information:
I’m viewing this in “Preview as test site”. I don’t want to publish this site, because it’s just a junk site that I’m using to test things out. There are a few other things that I’ve found that don’t seem to work in preview test site mode. Is this one of them? Or is this broken? Or am I doing something wrong/misusing the API?
Suggested fix for Velo documentation
The first thing I tried was to set properties directly onto the menu object, like this:
myMenu.menuItems[0].label = “NEW LABEL”;
This didn’t work, and it’s also what the other person tried in the other forum post. The API docs don’t say ANYTHING about this being the wrong way to do it, nor do they give a working example.
Setting properties on an object is probably the first thing that most coders will do. If for some reason this isn’t supposed to work, then the Velo docs really need to reflect a working code/API example.
