Finden Sie eine Online-Sandbox-Vuetify-3-Vorlage zum Erstellen eines minimal reproduzierbaren Beispiels

Question

Ich bin bei der Verwendung von Vuetify 3 auf ein Problem gestoßen, das ich auf Stack Overflow stellen wollte, aber dazu musste ich ein minimal reproduzierbares Beispiel erstellen. Wo finde ich eine Vorlage, auf die ich zurückgreifen kann?

Was ich versucht habe

• Ich habe versucht, mein eigenes Beispiel auf codesandbox.io zu erstellen, aber da ich die Sandbox nicht sehr oft verwende, hat es lange gedauert, bis es funktionierte.
• Ich habe versucht zu googeln, um ein vorhandenes Beispiel zu finden, konnte aber keins finden.
• Ich habe versucht, das in der Vuetify-Dokumentation bereitgestellte Beispiel zu verwenden, aber es scheint mir nicht möglich zu sein, den geänderten Status zu speichern und zu teilen. [Update: Das ist falsch, wie die akzeptierte Antwort erklärt. ]

Answer 1

这里有一个官方的 playground，如果你想使用 SFCs，这可能是最简单的方式。playground 的内容被编码到 URL 中，所以你可以通过保存 URL 来保存它。

或者你可以使用 CDN Vue 和 Vuetify 创建一个代码片段：

const { createApp, ref } = Vue
const { createVuetify } = Vuetify
const vuetify = createVuetify()
const app = {
  template: `
    <v-app>
      <v-main>
        
      </v-main>
    </v-app>
  `,
  setup(){
    return {
      
    }
  }
}
createApp(app).use(vuetify).mount('#app')

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/vuetify@3/dist/vuetify.min.css" />
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@5.x/css/materialdesignicons.min.css" rel="stylesheet">
<div id="app"></div>
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@3/dist/vuetify.min.js"></script>