Mukhriddin.dev banner

SR SWE MUKHRIDDIN KHODIEV

Mukhriddin.dev

beta
Mukhriddin.devcover
IT Blog React Vue JavaScript TypeScript FRONTEND Ingliz tili
016. Vue.js da custom diretivalar bilan qanday ishlaymiz ?

016. Vue.js da custom diretivalar bilan qanday ishlaymiz ?

Dec 11, 2024

Custom Directiva Nima va Nega Kerak ? Vue.js custom direktivalar - bu HTML elementlariga maxsus funksionallik qo‘shish uchun ishlatiladigan vositadir. Vue'dagi standart direktivalar (v-if, v-for, v-bind, va boshqalar)dan tashqari, siz o‘z ehtiyojlaringizga mos keladigan direktivalarni yaratishingiz mumkin. Nega kerak? Takrorlanadigan funksionallikni boshqarish: Masalan, har bir form inputiga fokuslash kerak bo'lsa, v-focus kabi custom direktiva yaratib, un

    vue js directives
017. Vue.js da eng ko'p ishlatiladigan custom direktivalar

017. Vue.js da eng ko'p ishlatiladigan custom direktivalar

Dec 11, 2024

Vue.js’da eng ko‘p ishlatiladigan custom direktivalar odatda umumiy funksionallikni soddalashtirish yoki takrorlanadigan ishlarni avtomatlashtirish uchun ishlatiladi. Quyida eng ko‘p ishlatiladigan va foydali bo‘lgan custom direktivalar keltirilgan: 1. v-focus — Fokusni elementga qo'yish Formada yoki modalda avtomatik fokuslash uchun ishlatiladi. Misol: export const focusDirective: Directive = { mounted(el: HTMLElement) { el.focus(); } }; Foy
    vue extra
018. Vue.js Composables haqida

018. Vue.js Composables haqida

Dec 11, 2024

Vue.js Composables haqida Composables - bu Vue 3 Composition API bilan ishlashda qayta foydalaniladigan mantiqiy qismlar va funksiyalarni tashkil qilish usuli. Composables yordamida siz komponentlar o‘rtasida kodni bo‘lishishingiz va qayta ishlatiladigan funksionallik yaratishingiz mumkin. Nega Composables kerak? Qayta foydalanish: Bir xil funksionallikni bir nechta komponentda ishlatishni soddalashtiradi. Kodning tozaligi: Komponentlar had

    vue javascript composables
015. Vue.js da nextTick haqida

015. Vue.js da nextTick haqida

Dec 9, 2024

Vue 3 nextTick - bu Vue komponentida DOM o'zgarishlari amalga oshirilganidan keyin kodni bajarish uchun ishlatiladigan yordamchi funksiyadir. Vue ichki reaktivlik tizimi asosan o'zgarishlarni guruhlab DOMni optimallashtirish uchun asenkron ravishda qayta render qiladi. nextTick yordamida o'zgarishlar DOMda aks etgandan so'ng ma'lum bir kodni bajarish mumkin. Qanday ishlaydi? nextTick Vue komponentidagi DOM holatini to'liq yangilashni kutib, undan keyin kodni bajaradi. Bu, masalan,

    vue javascript nextTick
014. Vue.js da toRefs haqida

014. Vue.js da toRefs haqida

Nov 11, 2024

Mana, toRefs haqida barcha ma’lumotlar bitta joyda nusxalash uchun tayyor shaklda: Vue 3: toRefs haqida to‘liq qo‘llanma toRefs funksiyasi reactive obyektni destrukturatsiya qilganda reaktivlikni saqlash uchun ishlatiladi. Oddiy Misol <template> <p>Count: {{ count }}</p> <button @click="increment">Increment</button> </template> <script setup> import { reactive, toRefs } from 'vue'; const state = reactive({ count: 0, }); const { count } = toRefs

    vue ts refs
012. Vue.js da v-once va v-memo direktivasi ishlashi

012. Vue.js da v-once va v-memo direktivasi ishlashi

Nov 9, 2024

Vue 3.2 da kiritilgan v-memo direktivasi, v-once direktivasiga o&#39;xshash, lekin undan ko&#39;ra murakkabroq holatlarda qo&#39;llaniladi. Bu direktiva elementni yoki komponentni qayta renderlashdan saqlaydi va shu orqali ilovaning ish faoliyatini yaxshilaydi. Lekin, bu faqatgina unga bog&#39;langan ma&#39;lum bir qiymatlar o&#39;zgarmagan taqdirda amalga oshadi. v-memo Direktivasining Asosiy qoidasi: Ma&#39;lum shartlar bo&#39;yicha qayta renderlashni cheklash: v-memo bilan, komponent yoki element faq

    vue javascript direktiva
013. Vue.js da Computed funksiyasi qanday ishlaydi ?

013. Vue.js da Computed funksiyasi qanday ishlaydi ?

Nov 9, 2024

Vue’da ``computed`` properties — hisoblanadigan xossalar bo&#39;lib, ular murakkab hisob-kitoblarni avtomatik bajarishga yordam beradi. Ular komponentdagi qiymatlarni qayta hisoblash zarur bo&#39;lganda ishlatiladi, lekin Vue ularni faqat kerakli o&#39;zgarishlar bo&#39;lgandagina yangilaydi. Bu esa komponentning ish faoliyatini yaxshilaydi va qayta renderlashlarni kamaytiradi. Computed Properties ning Asosiy Afzalliklari Keshlash: Computed properties avtomatik ravishda keshlanadi,

    vue javascript frontend
011. Vue.js da Direktivalar

011. Vue.js da Direktivalar

Nov 9, 2024

Assalamu alaykum! Vue 3 da mavjud bo&#39;lgan barcha direktivalarni to&#39;liqroq ko&#39;rib chiqamiz. 1. v-bind - Atributlarni Bog&#39;lash Atributlarni dinamik qiymatlar bilan bog&#39;lash imkonini beradi. Ko&#39;pincha :attribute sifatida qisqartiriladi. <img v-bind:src="imageUrl" alt="Rasm"> 2. v-model - Ikki Tomonlama Data Bog&#39;lash Ma&#39;lumotlarni komponent bilan asinxron sinxronlash imkonini beradi. v-model form elementlari bilan ishlas

    vue javascript direktiva
010. Vue.JS da WatchEffect funksiyasi qanday ishlaydi va vazifasi nima ?

010. Vue.JS da WatchEffect funksiyasi qanday ishlaydi va vazifasi nima ?

Sep 30, 2024

Vue 3 da watchEffect - reaktiv hisoblashni (reactive computation ref , reactivelarni ) kuzatish uchun mo&#39;ljallangan funksiya. U har qanday reaktiv o&#39;zgaruvchi o&#39;zgarganda avtomatik ravishda qayta ishga tushadi. Bu, asosan, side effektlarni kuzatish uchun foydalidir. khodieff.uz Asosiy Misol: Keling, oddiy bir misol bilan boshlaymiz. Faraz qilaylik, bizda bir reaktiv o&#39;zgar

    vue frontend js
002. Vue.js Loyihamizning tuzilmasi haqida.

002. Vue.js Loyihamizning tuzilmasi haqida.

Aug 31, 2024

Assalamu alaykum! Vue.js loyihasi Vite orqali yaratilganda, loyihaning tuzilmasi quyidagicha bo&#39;ladi. Har bir katalog va faylning maqsadi va vazifalari haqida batafsil tanishamiz. khodieff.uz my-app/ ├── node_modules/ ├── public/ │ └── vite.svg ├── src/ │ ├── assets/ │ │ └──

    vue frontend js
001. Vue.js da Vite texnologiyasi yordamidanloyiha qurishni o'rganamiz!

001. Vue.js da Vite texnologiyasi yordamidanloyiha qurishni o'rganamiz!

Aug 31, 2024

Assalamu alaykum! Demak Vite texnologiyasi yordamidan Vue loyiha qurishni o&#39;rganamiz! khodieff.uz Vite — Vue.js ilovasini yaratish uchun tez va samarali texnologiya hisoblanadi. Quyida Vite yordamida Vue.js (app) yaratish jarayonini batafsil ko&#39;rib chiqamiz. **1. Muhitni tayyorla

    vue frontend js vite
009. Vue.Js da Emit tushunchasi

009. Vue.Js da Emit tushunchasi

Aug 31, 2024

khodieff.uz Assalamu alaykum ! Vue.js da emit hodisalari yordamida komponentlar o&#39;rtasida ma&#39;lumot almashish imkoniyati mavjud. Emit hodisalari yordamida bola komponent ota komponentga ma&#39;lumot yuborishi mumkin. Quyida emit hodisalari haqida batafsil ko&#39;rib chiqamiz. `e
    vue frontend js
003. Vue.js "script setup" Sintaksisi

003. Vue.js "script setup" Sintaksisi

Aug 31, 2024

Vue.js-da script setup sintaksisi Vue 3.2 versiyasidan boshlab qo&#39;shilgan yangi sintaksis variantidir va Composition API-ni ishlatishni juda osonlashtiradi. Bu sintaksis yordamida siz Vue komponentlarini yozish uchun ancha qisqa va tushunarli kod yozishingiz mumkin. Mana asosiy nuqtalari: script setup Sintaksisi Asosiy Struktur: <template> <!-- Shablon HTML kodi --> </template> <script setup> // Bu yerda Composition API kodlarini yozasiz </scr

    vue frontend js
008. Vue.js da Props tushunchasi

008. Vue.js da Props tushunchasi

Aug 31, 2024

khodieff.uz Assalamu alaykum ! Props - Vue.js ning eng kerakli qismilaridan biri bo&#39;lib, komponentlar aro ma&#39;lumotni almashinish imkonini beradi. props-larni ishlatish setup funksiyasi ichida amalga oshiriladi. Quyida props-larni &lt;script setup&gt; bilan qanday ishlash haqid

    vue frontend js
004. Vue.js da reaktivlik (reactivity)

004. Vue.js da reaktivlik (reactivity)

Aug 31, 2024

Vue3 da reaktivlik (reactivity) asosiy qismlardan biri hisoblanadi, bu dastur yoki saytimizning dinamikligini va interaktivligini ta’minlash uchun ishlatiladi. Vue3 da reaktivlik Vue&#39;ning Composition API (versiyasi) orqali amalga oshiriladi. Bu &quot;Composition API&quot; (v3) Vue 2 dagi &quot;Options API&quot; bilan solishtirganda ancha tartibli ishlash va qulaylikni beradi. ![khodieff.uz](https://media.dev.to/cdn-cgi/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to

    vue frontend js
1 2 »