My appNav.js components is not working what to do?

[daiky00]

Hi,

I am getting the errors below after following the documentation you have so far. What can I do in this case? Thank you in advanced

TypeError: Cannot read property 'items' of null AppNav.render C:/webapps/htdocs/wordpress/wp-app/app/components/nav/_AppNav.js AppNav.tryRender http://localhost:3000/main.js:721:2 AppNav.proxiedMethod http://localhost:3000/main.js:6295:2 ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext http://localhost:3000/main.js:6601:2 ReactCompositeComponentWrapper._renderValidatedComponent http://localhost:3000/main.js:6601:2 ReactCompositeComponentWrapper.performInitialMount http://localhost:3000/main.js:6601:2 ReactCompositeComponentWrapper.mountComponent http://localhost:3000/main.js:6601:2 Object.mountComponent http://localhost:3000/main.js:1321:2 Object.updateChildren http://localhost:3000/main.js:6583:2 ReactDOMComponent._reconcilerUpdateChildren http://localhost:3000/main.js:6757:2

[ramsaylanier]

You have created menu items using the WordPress backend, correct? My guess is that maybe the menu slug isn't correct. I'll take a deeper look tomorrow.

[daiky00]

Hi, yes that's correct I create a menu using two pages: post and homepage. Any advice will be much appreciated.

[ramsaylanier]

What does your header.js component look like? My second guess is that your menu doesn't have the right slug.

Mine looks like this:

Notice menu="primary-navigation". primary-navigation is the slug of the menu. Make sure your menu has that slug, or change it to whatever the slug of your current menu is.

Basically, GraphQL isn't finding your menu, therefore in AppNav when it tries to map through each of the menu items you get an error (because menu items don't exist).

[ramsaylanier]

Lastly, here is the documentation for WordExpressMenu component: https://github.com/ramsaylanier/WordExpressComponents#wordexpressmenu

[daiky00]

Thank You. that fixed the problem is all good now :)