寻找在线沙盒Vuetify 3模板，用于创建一个最小可复现的示例

Question

我在使用 Vuetify 3 的过程中遇到了一个问题，我想在 Stack Overflow 上询问，但为了做到这一点，我需要创建一个最小可复现的示例。我在哪里可以找到一个我可以参考的模板？

我尝试过的方法

• 我尝试在 codesandbox.io 上创建自己的示例，但由于我不经常使用沙盒，所以花了很长时间才使其工作。
• 我尝试通过谷歌搜索找到一个现有的示例，但没有找到。
• 我尝试使用 Vuetify 文档中提供的示例，但似乎无法保存和共享修改后的状态。[更新：这是不正确的，正如接受的答案所解释的那样。]

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>