Өөрийн директив үүсгэх

Өмнөх хичээлүүдийн кодод директивүүдийг ашиглаж байсан ч тэдгээрийг Vue фреймворкийн тодорхой хэрэгсэл байдлаар ойлгон хэрэглэж ирсэн. Одоо директивүүдийн талаар дэлгэрүүлэн судлаж ойлголтоо гүнзгийрүүлэх цаг болсон. Директив гэдэг нь html шаблоны дотор ашиглан хуудасны элементүүдтэй харьцан ажиллах боломжийг өгдөг тусгай атрибут юм. Өмнөх хичээлүүдэд бид v-on, v-bind гэх мэтийн директивүүдийг их олон ашигласан. Энэ хичээлээр бид өөрсдийн директивийг үүсгэн ашиглаж сурцгаах болно. Хичээлд ашиглах төсөл доорх код бүхий

<template>
  <div>
      <h2>{{ title }}</h2>  
  </div>
</template>

<script>
export default {
  data () {
    return {
      title: "Hello I am Vue!"
    }
  }
}
</script>

<style scoped>

</style>

нэг App.vue компонентоос бүрдэнэ.

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

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

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

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

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

Vue.directive('colored', ColorDirective)

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

  Нээгдсэн тоо: 557 Бүртгүүлэх

Jsx нь html -тэй төстэй харагдах ч ердийн javascript бичлэг болох, хэрхэн ажилладагийг JSX хичээлээс мэдсэн тул Jsx -ээр хуудасны тэмдэглээг хийхэд ямар хязгаарлалт үйлчилдэг талаар авч үзье.

class App extends Component {
  render() {
    return (
      <div className="App">
        <h1>
          Hello world!
        </h1>
      </div>
    )
  }
}

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

Javascript хэл анхнаасаа обьект хандлагат технологиор зохиогдсон тул эхлэн суралцаж байгаа хүмүүс жаахан хүнд мэт санагдаж болох талтай. Ер нь ОХП хэлүүдийг сурахад обьект хандлагат технологийн суурийг их зөв ойлгосон байх хэрэгтэйг зөвлөе. Иймээс сайтын Програмчлал хэсгийн ОХП ухагдхууныг хөндсөн хичээлүүдийг үзэхийг зөвлөе. Хичээлийн материалыг бүрэн ойлгохын тулд Rxjs сан хичээлийн багцыг эхнээс нь бүгдийг судалбал илүү үр дүнтэй.

Энэ хичээлээр RxJs санг ашиглан өөр стримүүдийг нэг стримд нэгтгэх боломжийн талаар авч үзэх болно.

merge арга

Энгийн жишээнээс эхлэе. index.js файлд

const s1$ = Rx.Observable.of('Hello');
const s2$ = Rx.Observable.of('World');

RxJs сангийн Observable классын of аргаар мөрүүдээс s1, s2 хувьсагчид стримүүдийг үүсгээд эдгээрийг нэг стримд merge аргаар

const s1$ = Rx.Observable.of('Hello');
const s2$ = Rx.Observable.of('World');

s1$.merge(s2$).subscribe(createSubscribe('merge'));

гэж нэгтгэнэ.

  Нээгдсэн тоо: 574 Бүртгүүлэх

React компонентод параметр дамжуулах бас нэгэн аргыг авч үзье. Компонентийн хэвд jsx гэж нэрлэгддэг html маягийн бичлэгийг ашиглаж байгаа. App компонентод Car компонентийг оруулан ирэхдээ

<Car name={'Toyata Prius'} year={'2018'} />

гэж компонентийн нэрийг өөрөө хаагдсан (/> -ийг ашиглана) html тег хэлбэрээр бичин өгч байгаа.

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

 

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

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

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

тэгшитгэлийн хувьд утгыг ол

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

 

тэгшитгэлийн хамгийн их сөрөг язгуурыг ол.

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

 

тэнцэтгэл b -ийн ямар утганд биелэх вэ?

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