如何使用Quasar Vue Framework 14.3在组件中制作侧面板

Question

我有一个使用Quasar版本14.3的工作左侧面板。现在我想把它变成一个组件。当我使用它时：

<template>
  <q-layout ref="layout"
            :left-breakpoint=0>

    <q-scroll-area slot="left" style="width: 80%; height: 100%>
      <div>
        <left-panel></left-panel>
      </div>
    </q-scroll-area>
  </q-layout>
</template>

然而，它有点有效：

• 宽度给出了css问题
• 我是否真的必须将q-scroll-area保留在组件之外？什么时候 我包括它侧面板不隐藏，但在页面然后 向下滚动时，实际页面位于其下方。

有关如何使用Quasar在组件中制作实体侧面板的任何建议吗？

Answer 1

您可以使用q-layout-drawer在q-layout中创建左侧面板

/android

在Vue组件的数据中将标志设置为true。也可以通过将标志true设置为false来在单击按钮时打开/关闭抽屉