v-메뉴 구성 요소가 표시되지 않음

v-메뉴 구성 요소가 표시되지 않음

그래서 나는 뷔에티파이에서 드롭다운 메뉴를 만드는 방법에 대한 첫 번째 예를 따라왔다.나는 기본적으로 전체 코드를 복사하여 올바르게 수행되었는지 확인하고 그 예에서 참조한 필요한 변수를 추가했다.

내가 가지고 있는 문제는 v-메뉴와 그 태그 안의 모든 것이 전혀 나타나지 않는다는 것이다.예를 들어 내가 가지고 있는 메뉴는 v-btn을 사용하는 것인데, v-메뉴 태그 밖에 있는 한 볼 수 있다.'npm 실행 빌드'와 크롬 디버거도 오류가 발생하지 않는다.다른 Vuetify 구성 요소를 사용할 수 있지만 v-메뉴가 문서화된 것처럼 작동하지 않음...

어떤 도움이라도 감사할 것이다.

나는 가까스로 그것을 성공시켰다.

vue 프로젝트를 생성할 때는 vue-cli를 사용하는 것이 좋다.

나는 명령행에서 다음과 같이 했다.

$> yarn global add @vue/cli
$> vue create vuetify
$> yarn add vuetify

나는 덧붙였다.Vuetifymain.js:

import Vue from 'vue'
import App from './App.vue'
import Vuetify from 'vuetify'

Vue.config.productionTip = false

Vue.use(Vuetify)

new Vue({
  render: h => h(App),
}).$mount('#app')

그리고 나서 나는 다음에서 내용을 바꾸었다.components\HelloWorld.vue예를 들어:

<template>
  <div class="text-xs-center">
    <v-menu offset-y>
      <template v-slot:activator="{ on }">
        <v-btn
          color="primary"
          dark
          v-on="on"
        >
          Dropdown
        </v-btn>
      </template>
      <v-list>
        <v-list-tile
          v-for="(item, index) in items"
          :key="index"
          @click="test"
        >
          <v-list-tile-title>{{ item.title }}</v-list-tile-title>
        </v-list-tile>
      </v-list>
    </v-menu>
  </div>
</template>

<script>
  export default {
    data: () => ({
      items: [
        { title: 'Click Me' },
        { title: 'Click Me' },
        { title: 'Click Me' },
        { title: 'Click Me 2' }
      ]
    }),
    methods: {
      test() {

      }
    }
  }
</script>

그럼 도망가.yarn serve

그리고 드롭다운 버튼은 css를 뺀 예상대로 동작한다.

참조URL: https://stackoverflow.com/questions/57109639/vuetify-v-menu-component-not-visible