Romi Posts - Answer Overflow

Romi

Explore posts from servers

NNuxt FFilament

Posts Comments

NNuxt

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

SEO

1 replies

FFilament

•Created by Romi on 12/29/2023 in #❓┊help

File Upload

Hi , I have set up s3 and images are getting uploaded to a folder called livewire-tmp/ even though I definded it to store in a public/ folder. even my db stores it as public/filename.jpg because of this my db and filenames dont match so cannot use the images

5 replies

NNuxt

•Created by Romi on 7/26/2023 in #❓・help

Api Uppercase or not :?

Hey not realy dicrect with Nuxt, but should api body data like status have capital letter:

{
  "status": "New"
}

{
  "status": "New"
}

{
  "status": "new"
}

{
  "status": "new"
}

feel like the secound option is the way but then how do we uppcease the first letter xD in the front end

2 replies

NNuxt

•Created by Romi on 7/22/2023 in #❓・help

Can't scroll on Mobile Menu using Nuxt-Link

Hey, I am having a problem where using my mobile menu after navigation I can't scroll anywhere. But if I open and close and don't navigate its fine. Here is a link to see https://omc-global.vercel.app Code:

7 replies

NNuxt

•Created by Romi on 7/6/2023 in #❓・help

Pinia, Local Storage ... :(

Hey, So I created a store to save a cart Id, its wordking great! exepect when I refresh the page... the store gets reset. So I then started using local storage to store the ID then fetch it back like below:

import { defineStore } from 'pinia';
import nuxtStorage from 'nuxt-storage';

// You can name the return value of `defineStore()` anything you want,
// but it's best to use the name of the store and surround it with `use`
// and `Store` (e.g. `useUserStore`, `useCartStore`, `useProductStore`)
// the first argument is a unique id of the store across your application
export const useCartStore = defineStore('cart', {
    state: () => ({
        id: nuxtStorage.localStorage.getData('cartId') || null,
    }),
});

import { defineStore } from 'pinia';
import nuxtStorage from 'nuxt-storage';

// You can name the return value of `defineStore()` anything you want,
// but it's best to use the name of the store and surround it with `use`
// and `Store` (e.g. `useUserStore`, `useCartStore`, `useProductStore`)
// the first argument is a unique id of the store across your application
export const useCartStore = defineStore('cart', {
    state: () => ({
        id: nuxtStorage.localStorage.getData('cartId') || null,
    }),
});

its still working when going between pages, local storage is getting updated but when I refresh the page all I get is null 😦

18 replies

NNuxt

•Created by Romi on 6/13/2023 in #❓・help

Showing user is on the page

Hi, I want to show if a user is on a certain page (for example /post/1 and another user goes to that page should show up that someone is on / editing on this page . hope that makes sense lol

4 replies

NNuxt

•Created by Romi on 5/21/2023 in #❓・help

Nuxt + Storyblok

Trying to render featured stories on my home page but any data I try to get from the story is coming as undefined. this is my FeaturedServices.vue

<template>
    <div class="py-24">
        <h2 class="text-6xl text-[#50b0ae] font-bold text-center mb-12">{{ blok.headline }}</h2>
        <div class="container grid gap-12 mx-auto my-12 md:grid-cols-3 place-items-start">
            <ServiceCard v-for="service in blok.services" :key="service.uuid" :service="service.content"
                :slug="service.full_slug" />
        </div>
    </div>
</template>

<script setup>
defineProps({ blok: Object })
</script>

<template>
    <div class="py-24">
        <h2 class="text-6xl text-[#50b0ae] font-bold text-center mb-12">{{ blok.headline }}</h2>
        <div class="container grid gap-12 mx-auto my-12 md:grid-cols-3 place-items-start">
            <ServiceCard v-for="service in blok.services" :key="service.uuid" :service="service.content"
                :slug="service.full_slug" />
        </div>
    </div>
</template>

<script setup>
defineProps({ blok: Object })
</script>

My Service Card

<template>
    <NuxtLink :to="'/' + slug" v-editable="service"
        class="w-full h-full bg-[#f7f6fd] rounded-[5px] text-center overflow-hidden">

        <div class="p-4">
            <h3 class="text-xl text-[#1d243d] font-bold mb-3">
                {{ service?.heading }}
            </h3>
            <div class="line-clamp-4">
                {{ service?.teaser }}
            </div>
        </div>
    </NuxtLink>
    {{ service?.slug }}
</template>
   
<script setup>
defineProps({ service: Object, slug: String })
</script>

<template>
    <NuxtLink :to="'/' + slug" v-editable="service"
        class="w-full h-full bg-[#f7f6fd] rounded-[5px] text-center overflow-hidden">

        <div class="p-4">
            <h3 class="text-xl text-[#1d243d] font-bold mb-3">
                {{ service?.heading }}
            </h3>
            <div class="line-clamp-4">
                {{ service?.teaser }}
            </div>
        </div>
    </NuxtLink>
    {{ service?.slug }}
</template>
   
<script setup>
defineProps({ service: Object, slug: String })
</script>

1 replies

NNuxt

•Created by Romi on 5/19/2023 in #❓・help

NuxtLink not working, getting console errors

7 replies

NNuxt

•Created by Romi on 4/18/2023 in #❓・help

Hey, is it possible to have a folder in the pages directory that does not effect the route?>

I know its possible in other frameworks but could not see any docs for Nuxt

4 replies

NNuxt

•Created by Romi on 3/8/2023 in #❓・help

Console.log the selected value (id)

Hi, I'm having trouble trying to console.log the id of the selected driver

6 replies

NNuxt

•Created by Romi on 2/22/2023 in #❓・help

Clear data and show confirmation message

this is something basic but have tried searching about it but struggling to find anything, any help would be much appreciated. This currently submits correctly but all the data in the inputs don't clear

const client = useSupabaseClient()


const createDriver = async (e) => {
    const { name, email, employed, active } = e.target.elements
    const { data, error } = await client.from('drivers').insert([
        {
            name: name.value,
            email: email.value,
            employed: employed.value,
            active: active.value,
        },
    ])
    if (error) {
        console.log(error)
    }

}

const client = useSupabaseClient()


const createDriver = async (e) => {
    const { name, email, employed, active } = e.target.elements
    const { data, error } = await client.from('drivers').insert([
        {
            name: name.value,
            email: email.value,
            employed: employed.value,
            active: active.value,
        },
    ])
    if (error) {
        console.log(error)
    }

}

1 replies

NNuxt

•Created by Romi on 2/21/2023 in #❓・help

How can I do this after initialization?

330 replies

NNuxt

•Created by Romi on 1/24/2023 in #❓・help

Display Images

So trying to load an image but getting 404, the image is stored in static/images/

 

 {
        name: 'Dashboard',
        icon: '/images/bar-chart-2.png',
        subItems: [
            {
                name: 'Overview',
                link: '/dashboard/overview'
            },
            {
                name: 'Analytics',
                link: '/dashboard/analytics'
            },
            {
                name: 'Reports',
                link: '/dashboard/reports'
            }
        ]
    },

 

 {
        name: 'Dashboard',
        icon: '/images/bar-chart-2.png',
        subItems: [
            {
                name: 'Overview',
                link: '/dashboard/overview'
            },
            {
                name: 'Analytics',
                link: '/dashboard/analytics'
            },
            {
                name: 'Reports',
                link: '/dashboard/reports'
            }
        ]
    },

28 replies

Gaming

Programming