如何在 Vue Composition API 中加载（已安装）组件
P粉010967136
2023-08-28 14:53:31
<p>我正在尝试加载<code>vue3-burger-menu</code>，但文档仅适用于<code>Options API</code>。另一方面，我使用<code>Composition API</code>，但我有点卡住了。</p>
<p>文档是这样说的：</p>
<pre class="brush:php;toolbar:false;">import { Slide } from 'vue3-burger-menu' // import the CSS transitions you wish to use, in this case we are using `Slide`
export default {
components: {
Slide // Register your component
}
}</pre>
<p>但是<code>导出默认值</code>对我不起作用。</p>
<p>那么，如何加载<code>幻灯片</code>？</p>
这里是工作游乐场与vue3-burger-menu 示例。
https://stackblitz.com/edit/vue-wwkpny ?file=src/App.vue
您必须将问题中的代码放入自定义组件中。
像这样：
MyMenu.vue
<template> <Slide> <a id="home" href="#"> <span>Home</span> </a> </Slide> </template> <script> import { Slide } from 'vue3-burger-menu' // import the CSS transitions you wish to use, in this case we are using `Slide` export default { components: { Slide // Register your component } } </script>并在应用程序中使用它：
App.vue
<template> <div id="app"> <MyMenu /> </div> </template> <script> import MyMenu from './components/MyMenu.vue' export default { name: 'App', components: { MyMenu } } </script>