Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Panels not displayed #8

Open
Donald2010 opened this issue Oct 16, 2024 · 4 comments
Open

Panels not displayed #8

Donald2010 opened this issue Oct 16, 2024 · 4 comments

Comments

@Donald2010
Copy link

Donald2010 commented Oct 16, 2024

I cloned codelayout and vue3-context-menu component in my project, and copied examples/views/BasicUseage.vue, just made some modification with regards to paths of components and assets. when run my project , the layout is displayed, but panels are all empty. What may be the reason, is there something like .css file missed ?

The page displayed as the following image1 whith horrizon scrollbar when primary sidebar is toggled on ,
scroll1

and the page is displayed as the following image2 whithout horrizon scrollbar when primary sidebar is toggle off,
scroll2

The source of basicusage.vue is almost same as in example,
basicusage1
basicusage2

@imengyu
Copy link
Owner

imengyu commented Oct 16, 2024

Try add the CSS code below:

.full-container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

If the height of the container is not defined, the layout component will not be able to calculate the appropriate height, so it will be displayed as 0px height, which means it cannot be seen

Snipaste_2024-10-16_17-46-17

@Donald2010
Copy link
Author

Donald2010 commented Oct 16, 2024

After adding the style to basicusage.vue,

  <style>
  .full-container {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
</style>

and adding a wraper to with style

.test-host {
    margin-top: 10px;
    margin-left: 20px;
    margin-right: 20px;
    height: 86vh;
  }

the sidebar appear, but main panel is still not shown
split1

and secondary sidebar is shown only if primary sidebar is toggle off.
split2

only if both sidebars are toggled off, the main panel appear
split3

@imengyu
Copy link
Owner

imengyu commented Oct 17, 2024

I cannot see your code, so I cannot know where the problem is.

You may start with the simplest project and gradually add code

Project example here: https://codesandbox.io/s/s8gq4r

@Donald2010
Copy link
Author

My fault. I made wrong configuration. It works well now.
Thank you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants