Inline стилүүд

Html хэвийн элементүүдэд хэвжүүлэлтийн стилийг шууд буюу inline /элементийн тодорхойлолтын мөрөнд/ зааж болдог. Үүнийг React компонентийн хэвийн элементүүдэд хэрхэн өгөхийг App компонентийн

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

кодоор харцгаая.

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

how_to_regБүртгүүлэх

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

Холбоотой материалууд
React хук

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

React 16.8 хувилбараас компонентийг Component классаас удамшуулахгүйгээр энгийн функц хэлбэрээр буюу функционал компонентийг бичих боломж бий болсон.
React компонентийн ажиллагааны үндэс бол төлвийн удирдлагад оршдог. Өөрөөр хэлбэл компонентийн төлвийг тодорхойлсон обьектийн аль нэгэн эсхүл бүхэлд нь өөрчлөлт ороход React энэ төлвөөс хамааралтай дэлгэцийн хэсгийг дахин зурдаг. Бид өмнөх хичээлүүдэд ашиглаж байсан Component классаас удамшсан компонентийн төлвийг өөрчлөхдөө this.setState({ pageTitle: newTitle }) гэх байдлаар setState аргыг ашиглаж байсан.

Үйл явцын модификаторууд /тохируулагч/

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

VueJs -ийн хуудсанд үйл явц нэмэх ажиллагааны дараагийн боломж бол үйл явцын модификатор буюу тохируулагч юм. Орчуулга сайнгүй болсон байх талтай тул модификатор гэдгээр нь ойлговол зүгээр. Хичээлээр модификаторууд ямар хэрэгтэй, юу хийдэг талаар авч үзье. Жишээ нь E-surgalt сайтад шилжих холбоосыг агуулсан

    <body>
        <div id="app">
            <h2>
                <a href="https:" target="_blank">E-surgalt</a>
            </h2>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <script>
            ...
        </script>
    </body>

хуудас байлаа гэж бодъё. Хөтөч дээр хуудсыг нээгээд холбоос дээр дарвал E-surgalt сайтыг шинэ цонхонд нээнэ.

Үйл явц нэмэх

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

Төлөв үүсгэх хичээлд App компонентийн бүх төлвүүдийг нэг дор state обьектод багцалсан. react -ийн төлвүүдтэй хэрхэн ажиллахыг харахын тулд App компонентод товч оруулаад түүн дээр дарахад h1 гарчигаар үзүүлэх текстийг солигдох ажиллагааг оруулъя. Үүний тулд App компонентийн кодод h1 гарчигийн доор

        <h1>
          {this.state.pageTitle}
        </h1>
        <button>Гарчиг өөрчлөх</button>
        <Car name={cars[0].name} year={cars[0].year} />

button тегээр Гарчиг өөрчлөх нэртэй товчийг нэмэн оруулаад хуудсаа харвал

CLI ямар хэрэгтэй вэ?

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

Хичээлээр Vue CLI гэж юу болох, юунд ашиглах, яагаад мэдэх хэрэгтэй тухай авч үзье. Vue CLI бол VueJS төслийг маш хурдан, эвтэйхэн байдлаар үүсгэн ашиглахад зориулагдсан хэрэгсэл. Бид өмнөх хичээлүүдэд html файлд VueJS санг оруулаад түүнийг ашиглаж болж байхад VueJS дээр бүтэн төсөл үүсгэх ямар шаардлагатай гэж бодож байж болно.

Үйл явдал…

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

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

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

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

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

 
Зочин (Visitor)

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

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

 
Лямбда

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

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

 
Outlet компонент

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

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

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

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

…

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

 
Нэргүй арга

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

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

 
Урвуу матриц

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

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

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

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

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

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

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

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

 
Бодлого 12.061

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

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

 
Бодлого 16.046

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

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

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