Content not appearing when first loading Plasmic?

Plasmic Studio Questions
1

Not sure why. But this content doesn’t appear when I first load Plasmic, unless I click somewhere. Can anyone help, or face this same issue?

import * as React from 'react'

export interface MyComponentProps {
  title?: string;
}

export default function myComponent({ 
  title,
  }:MyComponentProps) {

    myComponent.defaultProps = {
    title: "Some title",
  }
  
    return (    
      <div>
        Title: {title}
      </div>
  );
}

  registerComponent(MyComponent, {
    name: 'MyComponent',
    importPath: './styles/MyComponent',
    props: {
      title: 'string',
      }
    }
  )

image.png

image.png

2

Is it related to this typescript error?

image.png
image.png790×234 33.5 KB

3

Fixed by removing defaultProps. Seems it’s gonna be deprecated.

import * as React from 'react'

type MyComponentProps = { 
  className?: string,
  title?: string
 };

export default function myComponent({ 
  className,
  title = "Some title",
  }:MyComponentProps) {
  
    return (    
      <div className={className}>
        Title: {title}
      </div>
  );
}
4

@political_magpie you can also set default values in when you register the component.

registerComponent(MyComponent, {
  name: 'MyComponent',
  importPath: './styles/MyComponent',
  props: {
    title: {
      type: 'string',
      defaultValue: 'Placeholder Text Here',
    },
  },
});
5

This also allows you to not have those props as optional in your component