Үйл явдлыг боловсруулах дараалал

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

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

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

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

Холбоотой материалууд
Input талбарын боловсруулалт

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

Програмийн кодчлолийг тусгайлан заалгаж сурдаг зүйл биш. Ямарч зүйлийг өөрөө бие даан сурах боломжтой. Энэ талаар Бие даан сурах нийтлэлийг үзээд эрэгцүүлэн бодоорой. Энэ удаад Input талбарын боловсруулалтын талаар судлая.

Өмнөх хичээлүүдэд хуудасны элементүүдэд үйл явцын сонсогчийг тавин, түүнд параметр дамжуулан хүлээн авах аргуудыг сурсан. Энэ хичээлээр Input талбарт үүссэн үйл явцыг хэрхэн боловсруулахыг судлая. Үүний тулд App компонентийн h1 гарчигийн доор input талбарыг

      <div style={divStyle}>
        <h1>
          {this.state.pageTitle}
        </h1>
        <input type="text"/>
        <button onClick={this.changeTitleHandler.bind(this, 'App өөрчлөлт')}>Гарчиг өөрчлөх</button>

оруулан өгөөд хөтөч дээрх хуудсаа харвал

Энгийн Vue програм үүсгэх

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

Хичээлээр Vuejs -ийг ашиглан энгийн програмыг зохиоё. Үүний тулд Vuejs -ийн албан ёсны сайтад хандан GET STARTED цэсээр ороод хуудасны зүүн талын цэсээс Installation цэсийг сонговол

Vuejs -ийг суулгах аргуудын талаар дэлгэрэнгүй тайлбарласан хуудас нээгдэнэ. Vuejs бага хэмжээтэй энгийн фреймворк учраас түүнтэй ажиллахын тулд олон тооны тохиргоонууд хийн ажиллах орчинг бүрдүүлээд байх хэрэггүй кодод javascript санг оруулдагийн адилаар нэг script тэг ашиглан Vuejs -ийг оруулаад түүнийг ашиглах боломжтой. Vuejs -ийг ашиглах хамгийн энгийн ойлгомжтой арга бол CDN -ээс санг script тэгээр коддоо оруулан ирэх юм. Бид фреймворкийн ажиллагааг судлах гэж байгаа тул <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> мөрийг хуулан аваад дурын текст засварлагчийг нээгээд index.html файлыг доорх агуулгатайгаар

үүсгэн өгье.

Устгалтын амьдралын цикл

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

react компонентийн амьдалын суурь циклүүдийн сүүлийнх нь componentWillUnmount юм. Аргыг Car компонентод

   componentWillUnmount() {
    console.log('Car componentWillUnmount')
  }

нэмэн тодорхойльё. Арга хэзээ дуудагдахыг нэрнээс нь ойлгосон гэж бодож байна. componentWillUnmount арга компонентыг устган түүнийг DOM -оос хасах үед дуудагдана. Аргын ажиллагааг харахын тулд хөтөч дээр хуудсаа нээгээд машиний жагсаалтыг

Үйл явдал нэмэх

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

Хэрэглэгч талын хуудасны event буюу үйл явцын боловсруулалт динамик ажиллагааны чухал хэсэг байдаг. ИЙмээс VueJs -ээр үйл явцыг тодорхойлон тэдгээрийн боловсруулалтыг хэрхэн хийхийг

    <body>
        <div id="app">
            <h2>Тоолуур = {{ counter }}</h2>
            <button>Нэмэгдүүлэх</button>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <script>
            new Vue({
                el: '#app',
                data: {
                    counter: 0
                }
            })
        </script>
    </body>

кодтой хуудсаар судлая. Кодод h2 гарчигт Тоолуур = текстийн араас {{ counter }} гэж хувьсагчийг үзүүлнэ. counter -ийг Vue -гийн тохиргооны обьектын data талбарт 0 утгатайгаар зарласан.

Үйл явдал…

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

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

 
Холбоосын параметрүүд

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

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

 
Зочин (Visitor)

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

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

 
Лямбда

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

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

 
Outlet компонент

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

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

 
Хадгалагч (Memento)

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

…

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

 
Нэргүй арга

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

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

 
Урвуу матриц

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

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

 
Кодийн сайжруулалт

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

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

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

тэгшитгэлийн нэг язгуур нь эерэг, нөгөө язгуур нь сөрөг байх параметрийн бүх утгыг ол.
Тэнцэтгэл бишийн нэг шийд нь M -ээс бага нөгөө шийд нь M -ээс их байх гарцаагүй ба хүрэлцээтэй нөхцөлийг ашиглавал болох бөгөөд энэ тэнцэтгэл бишийг бодвол үед манай тэнцэтгэл бишийн шийдийн нэг нь эерэг нөгөө нь сөрөг байна.

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

 
Бодлого 13.054

функц [1;9] завсарын аль хэсэгт буурах вэ?

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

 
Бодлого 13.092

функцийн хамгийн бага утгыг ол.

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

 
© 2014 Зохиогчийн эрхээр хамгаалагдсан. Холбогдох - 96655195