picture screen shot , i work on safari vuejs 3 and sidebar with content component content-component , But when you continuously press the refresh page button in the browser, all content appears and disappears quickly <div id="app"> <div id="content" >…
I've set up a Vue3/Laravel app with a live-chat via Pusher which works over non-private channel chat. In the next step I want to use a private channel but something weird happens. The pusher.subscribe function that tries to send a…
I am conditionally rendering a child component using render function. Here is an example of the parent component with the child component: <Parent :index="1"> <Child> ... </Child> <Child> ... </Child> <Child> ... </Child> </Parent> in the render function of Parent…
using Laravel 9 and installed php artisan ui vue --auth command and create Login and Register components as well. and run npm install and npm run dev command also. but when I try to load Register or Login blade files…
I have a Laravel 10(php 8.1) project in which i have install vue 3 for making a dynamic component. Component Detail: I have created a component for showing team members of a company with a category bar where they can…
Let's say we have following pages: /profile-edit: A private page, where the user can edit his profile let's call him "Sam James". /profile/sam-james: A publicy available profile page (like LinkedIn, Facebook etc., which should have very good SEO and performance…
I have a card component: <template> <div class="z-50 flex w-[15vw] flex-col items-center justify-center gap-5 rounded-md border-2 border-gray-300 bg-[#f3f3f3] p-5 transition-all duration-300 hover:scale-105 hover:font-bold" > <div class="w-[100%]"> <div :class="color" class="flex w-fit items-center justify-center rounded-3xl px-2 text-sm text-white" > {{ collection }}…
I am trying to trigger an event from button to input file. Below is the code <template> <div> <PrimaryButton type="button" :for="props.videoId" :disabled="uploading" @click="selectVideo" > Upload </PrimaryButton> <input :hidden="true" :ref="videoInput" :id="props.videoId" type="file" @change="handleVideoLoad" // for emits :disabled="uploading" /> </div> </template> <script…
First Approach const list = reactive([1, 2, 3, 4, 5]); const handleClick = () =>{ list.push(...[11, 12, 13, 14, 15]); list.push(...[16, 17, 18, 19, 20]); Promise.resolve().then(() => { list.push(33) }); }; Second Approach const list = reactive([1, 2, 3, 4,…
I want to call function A , when someone clicks on the icon of the details and function B when the summary or text section of this detail summary / text is clicked. <details @click="function-A"> <summary @click="function-B"> Some Text </summary>…