useState

React аппликашний төлөвтэй ажиллахад зориулагдсан UseState хукийн ажиллагааг

import React from 'react'

function App() {
  return (
      <div className="container">
        <h1>Тоолуур</h1>
        <button className="btn btn-success mx-3">Нэмэх</button>
        <button className="btn btn-danger">Хасах</button>
      </div>
  );
}

export default App;

кодоор судлая. Туршилтын төслийг React хук хичээлд үүсгэсэнг сануулъя. Дээрх код бол харагдах байдлыг л тодорхойлж байгаа. Харин тоолууртай ажиллахын тулд төлвийг UseState хукийг ашиглан оруулан ирье.

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

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

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

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

Обьектыг үүсгэх

String обьект нь энгийн тэмдэгтийн төрөлд харгалзах хэлний дотоод обьект юм. Обьект мөрийг шалгах, хэсгийг таслан авах, том жижиг үсгэнд шилжүүлэх гээд олон тооны аргуудтай. Энэ хичээлээр бид String обьектын ихээр хэрэглэдэг аргуудын талаар авч үзэх болно. String() конструктур нь анхны утгыг заан өгөх заавал байх шаардлагагүй параметртэй. Обьектыг үүсгэх жишээнүүд

var s = new String();
var head1 = new String("JavaScript хичээлүүд");

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

Форм дээрх контролуудыг Vuelidate пакетийн боломжийг ашиглан шалгахыг сурсан. Vuelidate пакетад олон тооны шалгагчид байгаа хэдий ч бид өөрсдийн шалгагчийг үүсгэх шаардлага гардаг. Жишээ нь шинэ хэрэглэгчийг бүртгэх форм хэрэглэгчийн цахим шуудангийн хаяг давтагдахгүй байхыг шалгах хэрэгтэй боллоо гэе. Өөрөөр хэлбэл манай өөрийн өгөгдлийн санд хэрэглэгчийн оруулсан цахим шуудангийн хаяг байгаа эсэхийг шалгах хэрэгтэй болсон гэсэн үг. Vuelidate пакетад манай өгөгдлийн санд хандан шалгалт явуулах шалгагч байхгүй гэдэг нь ойлгомжтой. Эндээс бид өөрсдийн шалгагч үүсгэхийг сурах хэрэгцээ гарч ирнэ.

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

Өмнөх хичээлүүдэд үүсгэсэн App, Car компонентууд өөрийн статик агуулгуудыг л хуудаст харуулж байгаад бага зэргийн динамик ажиллагааг оруулах гээд үзье. Компонентийн агуулгын хэсэг jsx бичлэгийн дүрмээр бичигдсэн javascript код учраас бид түүнд динамик ажиллагааг оруулахад төвөггүй мэт. Иймээс Car компонентийн кодийг

import React from 'react'

const car = () => <div>
  <p>This is car component</p>
  <p><strong>1+1</strong></p>
</div>

export default car

гэж өөрчлөөд хуудсаа харвал

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

Директивт дамжуулж болох бас нэгэн параметр бол модификатор юм. Модификатр гэдгийг Үйл явцын модификаторууд /тохируулагч/ хичээлд үзснээр директивийн аргументийн араас цэгээр таслан өгч болох утгууд гэж ойлгож болно. Жишээ нь

<button v-on:click.prevent.stop="method">Button name</button>

бичлэг товч дээрх дарах үйл явцын v-on директивт prevent, stop модификаторуудыг дамжуулж байгаа. Иймээс бид өөрсдийн боловсруулсан директивтээ модификаторыг дамжуулан түүнтэй ажиллах боломжийг судлая.

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

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

тэнцэтгэл биш хэдэн бүхэл тоон шийдтэй вэ?

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

 

тэгшитгэлийг бод.

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

 

b1=3, bn=96, Sn=189 геометр прогресийн 8-р гишүүнийг ол.

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