Энгийн үйлдлүүд

Ердийн өгөгдлүүдээс стримийг үүсгэх, төрөл бүрийн стримийг амархан үүсгэх боломжуудыг олгодог зарим туслах функцуудын талаар энэ хичээлд авч үзье.

of арга.

Функцийн боломжийг судлахын тулд index.js файлд доорх кодыг оруулан өгье.

Rx.Observable.of(5)
    .subscribe(
        (x) => console.log('Next :', x),
        (err) => console.log('Error :', err),
        () => console.log('Completed')
    );

Дээрх код бидний өмнөх хичээлд үзсэнтэй төстэй боловч энэ удаа Observable классын of аргаар 5 гэсэн тооноос стрим үүсгэж байгаа. Кодын ажиллагааг шалгахын тулд index.html файлыг хөтөч дээр нээгээд консолын цонхыг харвал

Материалыг тусгай эрхтэй хэрэглэгч үзнэ.

request_quoteТусгай эрх авах

Мэдээлэл таалагдсан бол найзуудтайгаа хуваалцаарай.

  Нээгдсэн тоо: 1218 Нийтийн

Өмнөх хичээлүүдээр директивийг үүсгэн бүртгүүлэхийг сурсан. Директивийг main.js файлд

Vue.directive('colored', ColorDirective)

гэж бүртгүүлсэн. Төслийн хэмжээнд глобал хэлбэрээр ашиглагдах директивийг дээрх аргаар бүртгүүлдэг. Үүнээс гадна компонент дотор директивийг

  Нээгдсэн тоо: 2283 Төлбөртэй

Үйл явдлыг боловсруулах бол Javascript программын үндсэн үүрэг гэж үзэхэд бараг болно. Иймд хичээлийг сайн үзээд ойлгон авах хэрэгтэй. Нэг үйл явдал тухайн үйл явц болсон элементэд нөлөө үзүүлэхээс гадна түүний дээрх элементүүдэд бас үйлчилдэг. Энэ нь элементэд олон дараалсан HTML тег агуулагдаж байх тохиолдолд тег бүрд боловсруулагч тавихгүйгээр дээд түвшин буюу эцэг элементэд ганц боловсруулагч заагаад бүх үйл явцыг барихад их эвтэйхэн байдаг. Гурван элемент нэг нэгдээ орон байрласан тохиолдлыг авч үзье.

  Нээгдсэн тоо: 979 Төлбөртэй

Сүүлийн жилүүдэд javascript сангуудын хөгжлөөр интернет програмчлалд хувьсгал гарч байгаа гэж хэлэхэд болно. Учир нь javascript хэлийг бүх хөтөч ойлгодог учраас хэрэглэгч талын ажиллагааг динамик болгон сервер талын ажиллагааны ачааллыг бууруулахад чухал үүрэг гүйцэтгэснээр SPA буюу нэг хуудаст програмыг зохиох боломжийг нээсэн. Javascript сангуудын нэг болох Vuejs сангийн тухай хичээлийг сайтад цувралаар нийтэлж байгаа билээ. Хичээлүүдийг бүгдийг Vue фреймворкийн үндсэн ойлголтууд багцаас үзэхийг зөвлөе.

Хүүхэд компонент хоорондын холбоо хичээлд төслийн компонентуудад зохих өөрчлөлтүүдийг оруулаад програмын ажиллагааг шалган үзэхэд Тоолуурыг нэмэгдүүлэх товчийг дарахад тоолуурын утга нэмэгдэхгүй байсан шалтгааныг танд үлдээсэн билээ. Товч ажиллахгүй байсан шалтгаан энгийн. Та Доод шатны /хүүхэд/ компонентоос параметр дамжуулах хичээлийн материалыг сайн ойлгосон бол учрыг маш хурдан олно. Товч ажиллахгүй байсан шалтгаан гэвэл Car компонентийн updateCounter аргаас үүсгэсэн counterUpdated үйл явцын сонсогчийг App компонентод тавин өгөөгүйтэй холбоотой. Тэгвэл үйл явцын сонсогчийг App компонентийн хэвд Car компонентийг оруулан ирэх app-car тегд

<template>
  <div>
    <h1>Эцэг: {{ carName }}</h1>
    <app-counter :counter="counter"></app-counter>
    <app-car
      :carName="carName"
      :carYear="carYear"
      :counter="counter"
      :changeFunc="changeCarName"
      @nameChanged = "carName = $event"
      @counterUpdated = "counter = counter + $event"     
    ></app-car>  
  </div>
</template>

@counterUpdated = "counter = counter + $event" гэж тавин өгөөд програмыг ажлуулан шалгавал

бүгд хэвийн ажиллана. App компонентийн хувьд Car, Counter компонентууд хоёулаа хүүхэд компонентууд ч Car компонентоос Counter компонентод хандан өөрчлөлт хийж байгаа. Энэ нь Доод шатны /хүүхэд/ компонентоос параметр дамжуулах механизмтай бараг төстэй ажиллахын дээр кодод үйл явцын сонсогч, нэг ижил параметрүүдийг дамжуулах, эцэг компонентоор дамжин харьцах гээд нилээд их логикийг оруулан өгч байгааг та ажигласан байх. Цөөн компонентууд оролцсон жижигхэн програмын хувьд аргачлал бүрэн боломжийн боловч компонентуудын тоо олшрон компонентууд нэгийгээ агуулах түвшин гүн болож ирэхэд эцэг компонентоор дамжуулан удирдахад хүнд болж ирнэ.

  Нээгдсэн тоо: 371 Төлбөртэй

Програмийн хэрэглэгч талын интерфейсийг css -ээр хэвжүүлэн ашиглахад эвтэйхэн, ойлгомжтой болгодог. Иймээс энэ хичээлээс react компонентийн элементүүдийг хэрхэн хэвжүүлэх талаар авч үзье. Манай төслийн интерфейс

зурагт үзүүлсэн хэлбэртэй болоод байгаа.

Үйл явдал /event/ тодорхой үйлдэл хийгдсэн талаар системд мэдэгддэг. Хэрвээ бид энэхүү үйлдлийг ажиглах хэрэгтэй бол яг энд…

Нээгдсэн тоо : 231

 

Манай төсөл олон хуудсуудтай болон тэдгээрийн хооронд динамикаар шилжилт хийж байгаа ч тухайн үед шилжилт хийгдсэн хуудаст тохирох…

Нээгдсэн тоо : 321

 

Зочин (Visitor) паттерн классуудыг өөрчлөхгүйгээр тэдгээрийн обьектуудын үйлдлийг тодорхойлох боломжийг олгоно. Зочин хэвийг ашиглахдаа классуудын хоёр ангилалыг тодорхойлно.…

Нээгдсэн тоо : 279

 

Лямбда-илэрхийлэл нь нэргүй аргын хураангуй бичилтийг илэрхийлнэ. Лямбда-илэрхийлэл утга буцаадаг, буцаасан утгыг өөр аргын…

Нээгдсэн тоо : 378

 

Кодийн сайжруулалт /рефакторинг/ хичээлээр програмийн кодоо react -ийн зарчимд нийцүүлэн компонентод салгасан.…

Нээгдсэн тоо : 424

 

Хадгалагч (Memento) хэв обьектын дотоод төлвийг түүний гадна гаргаж дараа нь хайрцаглалтын зарчмыг зөрчихгүйгээр обьектыг сэргээх боломжийг олгодог.

Нээгдсэн тоо : 449

 

Делегаттай нэргүй арга нягт холбоотой. Нэргүй аргуудыг делегатийн хувийг үүсгэхэд ашигладаг.
Нэргүй аргуудын тодорхойлолт delegate түлхүүр үгээр…

Нээгдсэн тоо : 518

 

Математикт харилцан урвуу тоонууд гэж бий. Ямар нэгэн тооны урвуу тоог олохдоо тухайн тоог сөрөг нэг зэрэг дэвшүүлээд…

Нээгдсэн тоо : 597

 

Төсөлд react-router-dom санг оруулан чиглүүлэгчдийг бүртгүүлэн тохируулсан Санг суулган тохируулах хичээлээр бид хуудас…

Нээгдсэн тоо : 624

 
Энэ долоо хоногт

Тэмцээнд 16 шатарчин оролцсон. Нэгийн давааны хуваарийн хичнээн хувилбар байж болох вэ? / Хуьаарьт дор хаяж нэг өрөгт тоглох хүмүүс нь ялгаатай бол хувилбар гэж тооцно. Тоглох өнгө, ширээний дугаарыг тооцохгүй/

Нээгдсэн тоо : 1298

 

Нээгдсэн тоо : 1069

 

prob02_187_01 илэрхийллийг хялбарчил.

Нээгдсэн тоо : 179