vuetifyjs / nuxt-module

Zero-config Nuxt Module for Vuetify
https://nuxt.vuetifyjs.com/
MIT License
225 stars 22 forks source link

use labComponents error #243

Closed iforgetyounow closed 3 months ago

iforgetyounow commented 4 months ago

template

<template>
  <v-container>
    <v-treeview :items="items" v-model:opened="open"></v-treeview>
  </v-container>
</template>
<script setup lang="ts">
const items = ref([
  {
    id: 1,
    title: 'Applications :',
    children: [
      { id: 2, title: 'Calendar : app' },
      { id: 3, title: 'Chrome : app' },
      { id: 4, title: 'Webstorm : app' },
    ],
  },
  {
    id: 5,
    title: 'Documents :',
    children: [
      {
        id: 6,
        title: 'vuetify :',
        children: [
          {
            id: 7,
            title: 'src :',
            children: [
              { id: 8, title: 'index : ts' },
              { id: 9, title: 'bootstrap : ts' },
            ],
          },
        ],
      },
      {
        id: 10,
        title: 'material2 :',
        children: [
          {
            id: 11,
            title: 'src :',
            children: [
              { id: 12, title: 'v-btn : ts' },
              { id: 13, title: 'v-card : ts' },
              { id: 14, title: 'v-window : ts' },
            ],
          },
        ],
      },
    ],
  },
  {
    id: 15,
    title: 'Downloads :',
    children: [
      { id: 16, title: 'October : pdf' },
      { id: 17, title: 'November : pdf' },
      { id: 18, title: 'Tutorial : html' },
    ],
  },
  {
    id: 19,
    title: 'Videos :',
    children: [
      {
        id: 20,
        title: 'Tutorials :',
        children: [
          { id: 21, title: 'Basic layouts : mp4' },
          { id: 22, title: 'Advanced techniques : mp4' },
          { id: 23, title: 'All about app : dir' },
        ],
      },
      { id: 24, title: 'Intro : mov' },
      { id: 25, title: 'Conference introduction : avi' },
    ],
  },
])
const search = ref([])
const filter =()=> {
  return items;
}
const open=ref([])

</script>

nuxt.config.js

  ssr:true
    vuetify: {
        moduleOptions: {
            ssrClientHints: {
                prefersColorScheme: false,
                prefersColorSchemeOptions: {}
            }
        },
        vuetifyOptions: {
            labComponents: true
        }
    },

view: image

iforgetyounow commented 4 months ago

image

iforgetyounow commented 4 months ago

"vuetify-nuxt-module": "^0.14.1"

iforgetyounow commented 4 months ago

But the error only occurs when I refresh the browser address. Does it not support SSR?

userquin commented 4 months ago

Open doesn't exist as model, try using :opened.

iforgetyounow commented 4 months ago

Open doesn't exist as model, try using :opened. This video can explain the reason for the error。ssr:false Can work 。ssr:true throw an exception demo.zip