2

我正在尝试在我的 Vue3 + Vite 项目中使用 VueThreeSixty ( https://github.com/rajeevgade/vue-360 ) 组件。

我导入了所有内容,将 VueThreeSixty 添加到我的组件对象中,但看起来我仍然缺少一些东西,你能帮我弄清楚什么吗?

[Vue warn]: Component is missing template or render function.  

这是我的代码。

    <template>
    <Navigation></Navigation>
    <div class="tb_header">

    </div>
    <div class="container">
        <div class="row">
            <div class="w-2/5">
                <VueThreeSixty
                    :amount="36"
                    imagePath="https://scaleflex.cloudimg.io/width/600/q35/https://scaleflex.ultrafast.io/https://scaleflex.airstore.io/demo/chair-360-36"
                    fileName="chair_{index}.jpg?v1"
                />
            </div>
            <div class="w-3/5">Sound</div>
        </div>
    </div> <template>

     <script>
     import Navigation from "../components/Navigation.vue";
     import Footer from "../components/Footer.vue";
     import VueThreeSixty from 'vue-360'

     import "vue-360/dist/css/style.css";

     export default {
     data() {},
     components: {
        Navigation,
        Footer,
        VueThreeSixty
    },
    };
    </script>

main.js

    import { createApp } from 'vue'
    import Home from './views/Home.vue'
    import Navigation from './components/Navigation.vue'
    import Footer from './components/Footer.vue'
    import App from './App.vue'
    import VueThreeSixty from 'vue-360'

    import 'vue-360/dist/css/style.css'

    import './main.css'
    import './typo.css'
    
    createApp(App)
    .use(VueThreeSixty)
    .mount('#app')
4

1 回答 1

1

您应该遵循https://github.com/rajeevgade/vue-360的文档。您需要先 'Vue.use' 组件并包含 tag vue-three-sixty。但看起来这个组件还不支持 Vue 3。

于 2022-01-08T21:09:23.463 回答