Joni Posts - Answer Overflow

Joni

•Created by Joni on 9/11/2024 in #❓・help

Pages Ref doesn't work from nuxt documentation

I was trying to call a function from a nuxtpage-child with the pageRef and defineExpose as documented here https://nuxt.com/docs/api/components/nuxt-page#pages-ref But it doesnt work, stackblitz for reproduction: https://stackblitz.com/edit/nuxt3-welcome-uf57hg?file=pages%2Fitems.vue,pages%2Fitems%2Findex.vue,app.vue

1 replies

NNuxt

•Created by Joni on 9/10/2024 in #❓・help

pinia custom plugin undefined

Hey there i have a custom fetch function from the docs https://nuxt.com/docs/guide/recipes/custom-usefetch but when declaring it inside the global store context of a pinia store its undefined, in the function scope it is not. But i dont really wanna call the useNuxtApp() composable everytime I fetch:

export const useUserStore = defineStore("userStore", (context) => {
// Global Store scope
  const nuxtApp = useNuxtApp()
  console.log(nuxtApp.$apiFetch); // undefined

  async function Fetch() {
// function scope
    const nuxtApp = useNuxtApp()

    await nuxtApp.$apiFetch() // working
  }
});

export const useUserStore = defineStore("userStore", (context) => {
// Global Store scope
  const nuxtApp = useNuxtApp()
  console.log(nuxtApp.$apiFetch); // undefined

  async function Fetch() {
// function scope
    const nuxtApp = useNuxtApp()

    await nuxtApp.$apiFetch() // working
  }
});

Do you have any regards why? Thanks!

7 replies

NNuxt

•Created by Joni on 8/27/2024 in #❓・help

Have multiple layouts for one page depending on condition

I have a terms and conditions page, it should be viewed when logged in and not logged in. Unfortunately, I can't assign a condition to it Error: "layout is not defined"

const userStore = useUserStore();

const {
  userIsLoggedIn,
  userHasAcceptedTerms,
  storeIsLoading,
} = storeToRefs(userStore);

const layout = computed(() => {
  return userIsLoggedIn?.value ? 'default' : 'no-auth';
});

definePageMeta({
  layout // OR   : userIsLoggedIn?.value ? 'default' : 'no-auth'  // "userIsLoggedIn is not defined"
})

const userStore = useUserStore();

const {
  userIsLoggedIn,
  userHasAcceptedTerms,
  storeIsLoading,
} = storeToRefs(userStore);

const layout = computed(() => {
  return userIsLoggedIn?.value ? 'default' : 'no-auth';
});

definePageMeta({
  layout // OR   : userIsLoggedIn?.value ? 'default' : 'no-auth'  // "userIsLoggedIn is not defined"
})

Thanks in advance!

5 replies

NNuxt

•Created by Joni on 8/12/2024 in #❓・help

Proxy websockets `ws://nuxtserver/ws-api/xyz` → `ws://mysecretdomain/xyz`

Hey there, I know this is probably annoying but has somebody found a way to proxy websockets? I'd like to do this without any extra proxy like nginx, traefik etc /ws-api/xyz → ws://mysecretdomain/xyz I tried several packages already and also some weird things, but had no luck.

2 replies

NNuxt

•Created by Joni on 5/14/2024 in #❓・help

Devtools Build Analyze not displayed

1 replies

NNuxt

•Created by Joni on 4/29/2024 in #❓・help

Layout optional for page

Hello there, I have a page file download and want the layout to be optional / conditional by pinia store:

definePageMeta
  layout: userStore.isLoggedIn ? "default" : "guest"

definePageMeta
  layout: userStore.isLoggedIn ? "default" : "guest"

Due to SSR nuxt throws error "userStore is not defined"... Workaround is

if (userStore)
  setPageLayout(userStore.isLoggedIn ? "default" : "guest");

if (userStore)
  setPageLayout(userStore.isLoggedIn ? "default" : "guest");

Due to SSR I get a hydration error, what should be the correct thing to do here?

2 replies

NNuxt

•Created by Joni on 3/3/2024 in #❓・help

Different highlighting depending on bun install and npm install

2 replies

NNuxt

•Created by Joni on 6/14/2023 in #❓・help

Nuxt prepare set dotenv path

15 replies

NNuxt

•Created by Joni on 5/7/2023 in #❓・help

How to navigate inside pinia store?

After I received my token from the backend I want to navigate the user to /, unfortunately navigateTo("/") doesnt work

LOGIN(_username: string, _password: string): void {
      console.info("Logging in with", _username, _password)
      this.username = _username;

      this.token = "Bearer Tokenasd asdasd asd"

      navigateTo("/")
    }

LOGIN(_username: string, _password: string): void {
      console.info("Logging in with", _username, _password)
      this.username = _username;

      this.token = "Bearer Tokenasd asdasd asd"

      navigateTo("/")
    }

13 replies

NNuxt

•Created by Joni on 5/2/2023 in #❓・help

workbox logger in console after build and deployment

1 replies

Gaming

Programming