Роутерийг тохируулах хичээлээр төсөлд Home, Cars хуудсуудыг үүсгэн чиглүүлэгчийг тохируулан бүртгүүлсэн хэдий ч хуудас хооронд шилжихдээ хаягийн мөрөнд шууд бичин өгч байгаа. Иймээс хуудас хоорондын шилжилтийг цэс үүсгэн түүгээр дамжуулан хийе. Та Формын шалгалтын бэлтгэл хичээлийг үзсэн бол төсөлд Bootstrap -ийг суулгасан гэдгийг мэдэж байгаа.
Материалыг тусгай эрхтэй хэрэглэгч үзнэ.
request_quoteТусгай эрх авахМэдээлэл таалагдсан бол найзуудтайгаа хуваалцаарай.
Нээгдсэн тоо: 451 Бүртгүүлэх
React компонентод параметр дамжуулах бас нэгэн аргыг авч үзье. Компонентийн хэвд jsx гэж нэрлэгддэг html маягийн бичлэгийг ашиглаж байгаа. App компонентод Car компонентийг оруулан ирэхдээ
<Car name={'Toyata Prius'} year={'2018'} />гэж компонентийн нэрийг өөрөө хаагдсан (/> -ийг ашиглана) html тег хэлбэрээр бичин өгч байгаа.
Нээгдсэн тоо: 857 Төлбөртэй
React компонентод тулгуурладаг сан тул компонент гэж юу болохыг ойлгоцгооё. Үүний тулд машиний мэдээллийг үзүүлэх
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Lesson 01_02</title>
<style>
.car {
display: inline-block;
border: 2px solid #ccc;
box-shadow: 2px 2px 1px #eee;
padding: 10px;
margin-right: 10px;
}
</style>
</head>
<body>
<div class="car">
<h3>Toyata Camry</h3>
<p>Year: <strong>2019</strong></p>
</div>
</body>
</html>код бүхий html файлыг үүсгээд хөтөч дээр нээвэл
гэж харагдана.
Нээгдсэн тоо: 1117 Төлбөртэй
Хичээлээр EcmaScript6 -гийн генератор гэж юу болох тэдгээртэй хэрхэн ажиллахыг авч үзье. Төсөлд генераторууд ажиллах боломжийг хангахын тулд package.json файлд зарим өөрчлөлтийг орулах хэрэгтэй. Генераторууд ES6 -д байдаггүй тусдаа пакет тул терминалыг нээгээд npm install --save-dev babel-plugin-transform-runtime командыг өгөн суулгана. Пакетыг суулгасны дараа package.json файлын devDependencies талбарт "babel-plugin-transform-runtime": "^6.23.0" бичлэг нэмэгдэнэ. Дээр нь төслийн үндсэн хавтаст .babelrc нэртэй файлыг нэмэн
{
"plugins": [
["transform-runtime", {
"polyfill": false,
"regenerator": true
}]
]
}кодыг оруулан өгөөд терминалаас webpack -ийг ажлуулан төслийн компайлыг хийнэ.
Нээгдсэн тоо: 263 Бүртгүүлэх
react компонентийн амьдалын суурь циклүүдийн сүүлийнх нь componentWillUnmount юм. Аргыг Car компонентод
componentWillUnmount() {
console.log('Car componentWillUnmount')
}нэмэн тодорхойльё. Арга хэзээ дуудагдахыг нэрнээс нь ойлгосон гэж бодож байна. componentWillUnmount арга компонентыг устган түүнийг DOM -оос хасах үед дуудагдана. Аргын ажиллагааг харахын тулд хөтөч дээр хуудсаа нээгээд машиний жагсаалтыг
тоонуудаас аль нь рационал тоонууд вэ?
A. a,b,e B. a,d,e C. b,c,e D. b,c,d E. a,c,d
Нээгдсэн тоо : 620