Strapi V4 refuses to save nested components

Questions and Answers
1
System Information
  • Strapi Version: 4.0.3
  • Database: Postgres
  • Node Version: 12

Hello, Strapi community!

Started tinkering with Strapi V4 today and noticed some concerning behavior, shown in the video above.

My observations are as follows:

  1. I couldn’t add the “design” component to the “blocks” via the Content Types Builder, I had to add it via the code like so:
{
  ...
  "attributes": {
    "design": {
      "type": "component",
      "repeatable": false,
      "component": "design-system.design-system"
    }
  }
  ...
}

  1. I assume this could cause issues, but I don’t believe it behaved this way in Strapi v3

  2. I understand stand that this might be a limitation of Strapi v4, but it seems odd that it would work in v3 but not v4 as it was crucial to my implementation.

3 Likes
2

Hi,

I am having the same problem with Strapi V4, were you able to find the issue?

1 Like
3

I haven’t. Seems like a hard stop blocker from us upgrading to v4 sadly. I was hoping to do it without migrating from v3 but seems like I may not have a choice yet.

1 Like
4

Wanted to give an update to this - I tried again with a barebones setup with a different db and this still poses as an issue

5

Would this be more appropriate as a GitHub issue?

6

hi @Nikush did you find any solution to this in strapi 4 ?

7

I also have a custom component where I try to add text and page relation and it doesn’t save. I would like to see if this can be addressed. We are on latest at this time with 4.1.3.

1 Like
8

I had this problem after migration from v3 to v4. In my case component with image field was not migrated. I had to change image field in component’s JSON file from

"image": {
      "model": "file",
      "via": "related",
      "allowedTypes": [
        "images"
      ],
      "plugin": "upload",
      "required": false,
      "pluginOptions": {}
    },

to

"image": {
      "allowedTypes": [
        "images"
      ],
      "type": "media",
      "multiple": false
    },

and change component’s “name” field to “displayName”.
Then it worked well

9

please how to create this nested component