haughty lodge
Hello, I am getting an error when we want to use the following code exactly.
<Menu shadow="md" width="{200}">
<Menu.Target>
<Button>Toggle menu</Button>
</Menu.Target>
<Menu.Dropdown>
<Menu.Label>Application</Menu.Label>
<Menu.Item>Settings</Menu.Item>
</Menu.Dropdown>
</Menu>
sage fable
not sure how relevant they are to your problem but two things to try
width={200}or width="200px"
haughty lodge
1 . Width is given as string and number, there is no problem in this,
2. This example is taken directly from mantine.dev.
sage fable
1 . Width is given as string and number, there is no problem in this,
2. This ex...
in jsx syntax you typically wrap the {} around the variable, this example has it the opposite way around
haughty lodge
I used the following example directly, I did not do anything like addition.
https://mantine.dev/core/menu/
sage fable
there is a difference here
your example
width="{200}"
this is not properly specified
basically, a prop with {} can contain any literal. a prop with "" is a string
what your example does is pass a string but then open literal brackets inside it, which won't be parsed correctly
haughty lodge
Ok, that's okay, even if I remove the width field, I still get the same error.
where it made a mistake
This is where <Menu.Target> is when I remove it, the error does not occur, but it does not meet my needs in this case.
haughty lodge
what your example does is pass a string but then open literal brackets inside it...
You are right, but as I said, even though I do not give any value, I still get an error.
When we use <Menu.Dropdown> or <Menu.Target> in this way, it gives the error on this line, so when we use Menu.(....) it gets an error.
sage fable
please recreate this in code sandbox
https://codesandbox.io/s/flamboyant-wave-kf5yi6
perhaps there is an issue with dependency versions
what mantine versions do you have in package.json?
haughty lodge
what mantine versions do you have in package.json?
I was going to write exactly this, to see if it's a problem with the version we use: 4.0.8, could it be due to this?
sage fable
can you show me your package.json?
but yes - if you're using the mantine.dev docs, it will probably be invalid syntax
haughty lodge
Yes, the syntax has changed, the project is built entirely on 4, and I will have to use the v4 document, since it will be very costly now to switch it to version 5.
Thank you very much for your interest.
sage fable
great, hope that fixes your issue
if your project ever wants to switch to v5, most of the changes are listed on the release changelog
https://mantine.dev/changelog/5-0-0/
it isn't too hard to upgrade, i have solo hobby projects with thousands of lines, the upgrade took just over an hour of work