Rad SideDrawer的更改内容（是'Second（第三，…）Side Drawer'

Question

应该很简单，但是如果我在这里问，也许其他人可以使用。

如何添加第二个侧抽屉？

我已经将DrawerContent.vue复制到DrawerContentL2.vue，并修改了内容。

并添加

import DrawerContentL2 from "./components/DrawerContentL2";

到我的app.js

原始的app.js看起来像

new Vue({
     render (h) {
        return h(
          App,
          [
            h(DrawerContent, { slot: 'drawerContent' }),
            h(Twisty, { slot: 'mainContent' })   
    ]
        )
  }
  }).$start();

现在呢？

Answer 1

对于NativeScript UI RadSideDrawer，您必须将第二个放在根目录的内容内。

或者，您也可以使用Igor Randjelovic专门为多抽屉功能编写的nativescript-vue-multi-drawer。

Answer 2

我尝试了我认为@Manoj在这里提出的建议：

    new Vue({ 
    render (h) {
      return h(
        App,
        [
          h(v-if (store.state.currentLevel == "L1"){DrawerContent} v-else {DrawerContentL2}, { slot: 'drawerContent' }),
          h(Home, { slot: 'mainContent' }) 
        ]
      )
    }
  }).$start() 

或者，或者，>>

new Vue({ 
render (h) {
  return h(
    App,
    [
      h(if (store.state.currentLevel == "L1"){DrawerContent} else {DrawerContentL2}, { slot: 'drawerContent' }),
      h(Home, { slot: 'mainContent' }) 
    ]
  )
}
}）。$ start（）

两者都在条件上画出了unexpected token错误。

Answer 3

而且，为了好玩，尝试将整个内容包装在有条件的包装中。

Answer 4

好，知道了。我没有尝试将slot: 'drawerContent'的内容从DrawerContent.vue更改为DrawerContentL2.vue，而是将它们放在两个不同的文件中，并使用DrawerContent.vue主菜单选择了其中一个。