寻找在线沙盒Vuetify 3模板,用于创建一个最小可复现的示例
P粉553428780
P粉553428780 2023-08-16 12:30:32
0
1
635
<p>我在使用 Vuetify 3 的过程中遇到了一个问题,我想在 Stack Overflow 上询问,但为了做到这一点,我需要创建一个最小可复现的示例。我在哪里可以找到一个我可以参考的模板?</p> <h2>我尝试过的方法</h2> <ul> <li>我尝试在 codesandbox.io 上创建自己的示例,但由于我不经常使用沙盒,所以花了很长时间才使其工作。</li> <li>我尝试通过谷歌搜索找到一个现有的示例,但没有找到。</li> <li>我尝试使用 Vuetify 文档中提供的示例,但似乎无法保存和共享修改后的状态。[更新:这是不正确的,正如接受的答案所解释的那样。]</li> </ul><p><br /></p>
P粉553428780
P粉553428780

全部回复(1)
P粉662802882

这里有一个官方的 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>
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板