Pāriet uz galveno saturu Pāriet uz dokumentu navigāciju
in English

Notiek migrēšana uz v5

Izsekojiet un pārskatiet izmaiņas Bootstrap avota failos, dokumentācijā un komponentos, lai palīdzētu migrēt no v4 uz v5.

Šajā lapā

Atkarības

  • Atmests jQuery.
  • Jaunināts no Popper v1.x uz Popper v2.x.
  • Libsass tika aizstāts ar Dart Sass, jo mūsu Sass kompilators, ņemot vērā Libsass, tika novecojis.
  • Migrēja no Jekyll uz Hugo, lai izveidotu mūsu dokumentāciju

Pārlūka atbalsts

  • Atmests Internet Explorer 10 un 11
  • Atmests Microsoft Edge < 16 (Legacy Edge)
  • Atmests Firefox <60
  • Atmests Safari < 12
  • Atmests iOS Safari < 12
  • Atmests Chrome < 60

Izmaiņas dokumentācijā

  • Pārveidota mājaslapa, dokumentu izkārtojums un kājene.
  • Pievienots jauns paku ceļvedis .
  • Pievienota jauna sadaļa Pielāgot , aizstājot v4 tēmas lapu ar jaunu informāciju par Sass, globālajām konfigurācijas opcijām, krāsu shēmām, CSS mainīgajiem un daudz ko citu.
  • Visa veidlapu dokumentācija ir pārkārtota jaunā sadaļā Veidlapas , sadalot saturu vairāk koncentrētās lapās.
  • Tāpat tika atjaunināta sadaļa Izkārtojums , lai skaidrāk precizētu režģa saturu.
  • Komponentu lapa “Navs” pārdēvēta par “Navs & Tabs”.
  • Pārdēvēta lapa “Checks” par “Checks & radios”.
  • Pārveidota navigācijas josla un pievienota jauna apakšnavigācija, lai būtu vieglāk pārvietoties mūsu vietnēs un dokumentu versijās.
  • Pievienots jauns īsinājumtaustiņš meklēšanas laukam: Ctrl + /.

Sass

  • Mēs esam atteikušies no noklusējuma Sass karšu sapludināšanas, lai atvieglotu lieko vērtību noņemšanu. Ņemiet vērā, ka tagad ir jādefinē visas vērtības Sass kartēs, piemēram, $theme-colors. Uzziniet, kā rīkoties ar Sass kartēm .

  • Laušanacolor-yiq()Funkcija un saistītie mainīgie ir pārdēvēti par, color-contrast()jo tie vairs nav saistīti ar YIQ krāsu telpu. Skatiet #30168.

    • $yiq-contrasted-thresholdir pārdēvēts par $min-contrast-ratio.
    • $yiq-text-darkun $yiq-text-lightir attiecīgi pārdēvēti par $color-contrast-darkun $color-contrast-light.

  • LaušanaMultivides vaicājumu mixins parametri ir mainīti, lai nodrošinātu loģiskāku pieeju.

    • media-breakpoint-down()izmanto pašu pārtraukuma punktu, nevis nākamo pārtraukuma punktu (piemēram, media-breakpoint-down(lg)tā vietā, lai media-breakpoint-down(md)atlasītu skatu logus, kas ir mazāki par lg).
    • Līdzīgi arī otrais parametrs media-breakpoint-between()izmanto pašu pārtraukuma punktu, nevis nākamo pārtraukuma punktu (piemēram, mērķa skata logu media-between(sm, lg)vietā starp un ).media-breakpoint-between(sm, md)smlg

  • LaušanaNoņemti drukas stili un $enable-print-stylesmainīgais. Drukas displeja klases joprojām pastāv. Skatiet #28339 .

  • LaušanaAtmests color(), theme-color()un gray()funkcijas par labu mainīgajiem. Skatiet #29083 .

  • Laušanatheme-color-level()Funkcija ir pārdēvēta par color-level()un tagad pieņem jebkuru vēlamo krāsu, nevis tikai $theme-colorkrāsas. Skatiet #29083 Uzmanieties: color-level() vēlāk tika izlaists v5.0.0-alpha3.

  • LaušanaPārdēvēts $enable-prefers-reduced-motion-media-queryun $enable-pointer-cursor-for-buttonsuz $enable-reduced-motionun $enable-button-pointersīsuma labad.

  • LaušanaNoņemts bg-gradient-variant()maisījums. Izmantojiet .bg-gradientklasi, lai elementiem pievienotu gradientus ģenerēto .bg-gradient-*klašu vietā.

  • Laušana Noņemti iepriekš novecojuši miksti:

    • hover, hover-focus, plain-hover-focus, unhover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(arī tika atcelta saistītā lietderības klase, .text-hide)
    • visibility()
    • form-control-focus()

  • LaušanaPārdēvēta scale-color()funkcija, shift-color()lai izvairītos no sadursmes ar paša Sass krāsu mērogošanas funkciju.

  • box-shadowmixins tagad atļauj nullvērtības un nokrīt noneno vairākiem argumentiem. Skatiet #30394 .

  • Miksējam border-radius()tagad ir noklusējuma vērtība.

Krāsu sistēma

  • Krāsu sistēma, kas strādāja ar color-level()un $theme-color-intervaltika noņemta par labu jaunai krāsu sistēmai. Visas lighten()un darken()funkcijas mūsu kodu bāzē ir aizstātas ar tint-color()un shade-color(). Šīs funkcijas sajauc krāsu ar baltu vai melnu, nevis mainīs tās gaišumu par noteiktu daudzumu. Tas shift-color()ietonēs vai ietonēs krāsu atkarībā no tā, vai tā svara parametrs ir pozitīvs vai negatīvs. Plašāku informāciju skatiet #30622 .

  • Pievienotas jaunas nokrāsas un toņi katrai krāsai, nodrošinot deviņas atsevišķas krāsas katrai pamatkrāsai kā jauni Sass mainīgie.

  • Uzlabots krāsu kontrasts. Samazināta krāsu kontrasta attiecība no 3:1 līdz 4,5:1 un atjauninātas zilas, zaļas, ciānas un rozā krāsas, lai nodrošinātu WCAG 2.1 AA kontrastu. Mainīja arī mūsu krāsu kontrasta krāsu no $gray-900uz $black.

  • Lai atbalstītu mūsu krāsu sistēmu, esam pievienojuši jaunas pielāgotas tint-color()un shade-color()funkcijas, lai atbilstoši sajauktu mūsu krāsas.

Režģa atjauninājumi

  • Jauns pārtraukuma punkts! Pievienots jauns xxlpārtraukuma punkts priekš 1400pxun uz augšu. Nekādas izmaiņas visos citos pārtraukuma punktos.

  • Uzlabotas notekcaurules. Notekcaurules tagad ir iestatītas rems un ir šaurākas par v4 ( 1.5rem, vai aptuveni 24px, uz leju no 30px). Tādējādi mūsu režģa sistēmas notekcaurules tiek saskaņotas ar mūsu atstarpes utilītprogrammām.

    • Pievienota jauna noteku klase ( .g-*, .gx-*, un .gy-*), lai kontrolētu horizontālās/vertikālās notekcaurules, horizontālās un vertikālās notekcaurules.
    • LaušanaPārdēvēts .no-gutterspar, .g-0lai atbilstu jaunajiem noteku komunālajiem pakalpojumiem.

  • Kolonnas vairs nav position: relativelietotas, tāpēc, iespējams, būs jāpievieno .position-relativedaži elementi, lai atjaunotu šo darbību.

  • LaušanaPameta vairākas .order-*nodarbības, kuras bieži palika neizmantotas. Tagad mēs nodrošinām .order-1tikai .order-5izņemšanu no kastes.

  • LaušanaKomponents tika atmests, .mediajo to var viegli pavairot ar utilītprogrammām. Skatiet #28265 un lapu flex utilities, lai iegūtu piemēru .

  • Laušana bootstrap-grid.csstagad attiecas tikai box-sizing: border-boxuz kolonnu, nevis atiestata globālo lodziņu izmēru. Tādā veidā mūsu režģa stilus var izmantot vairākās vietās bez traucējumiem.

  • $enable-grid-classesvairs neatspējo konteineru klašu ģenerēšanu. Skatiet #29146.

  • Atjaunināts make-colmixin pēc noklusējuma uz vienādām kolonnām bez norādīta izmēra.

Saturs, atsāknēšana utt

  • RFS tagad ir iespējots pēc noklusējuma. Virsraksti, kas izmantofont-size()mixin, automātiski pielāgos tofont-sizemērogu, izmantojot skata logu. Šī funkcija iepriekš tika izvēlēta 4. versijā.

  • LaušanaPārveidots mūsu displeja tipogrāfija, lai aizstātu mūsu $display-*mainīgos un ar $display-font-sizesSass karti. Noņemti arī atsevišķi $display-*-weightmainīgie vienai $display-font-weightun pielāgotai font-sizes.

  • Pievienoti divi jauni .display-*virsrakstu izmēri .display-5un .display-6.

  • Saites pēc noklusējuma ir pasvītrotas (ne tikai turot kursoru), ja vien tās nav daļa no konkrētiem komponentiem.

  • Pārveidotas tabulas , lai atsvaidzinātu to stilus un pārbūvētu tās ar CSS mainīgajiem, lai vairāk kontrolētu stilu.

  • LaušanaLigzdotas tabulas vairs nepārmanto stilus.

  • Laušana .thead-lightun .thead-darktiek atmesti par labu .table-*variantu klasēm, kuras var izmantot visiem tabulas elementiem ( thead, tbody, tfoot, tr, thun td).

  • LaušanaMiksīns table-row-variant()tiek pārdēvēts par table-variant()un pieņem tikai 2 parametrus: $color(krāsas nosaukums) un $value(krāsu kods). Apmales krāsa un akcentu krāsas tiek automātiski aprēķinātas, pamatojoties uz tabulas faktoru mainīgajiem.

  • Sadaliet tabulas šūnu pildījuma mainīgos uz -yun -x.

  • LaušanaAtkritusi .pre-scrollableklase. Skatiet #29135

  • Laušana .text-*utilītas saitēm vairs nepievieno kursora novietošanas un fokusa stāvokļus. .link-*tā vietā var izmantot palīgu klases. Skatiet #29267

  • LaušanaAtkritusi .text-justifyklase. Skatiet #29793

  • Atiestatīt noklusējuma horizontālo iestatījumu un elementus padding-leftno pārlūkprogrammas noklusējuma uz .<ul><ol>40px2rem

  • Pievienots $enable-smooth-scroll, kas attiecas uz scroll-behavior: smoothvisu pasauli, izņemot lietotājus, kuri pieprasa samazināt kustību, izmantojot prefers-reduced-motionmultivides vaicājumu. Skatiet #31877

RTL

  • Horizontālajam virzienam raksturīgie mainīgie, utilītprogrammas un mikseri ir pārdēvēti, lai izmantotu loģiskās īpašības, piemēram, tās, kas atrodamas flexbox izkārtojumos, piemēram, startun endvietā leftun right.

Veidlapas

  • Pievienotas jaunas peldošās formas! Mēs esam reklamējuši peldošo etiķešu piemēru pilnībā atbalstītiem veidlapas komponentiem. Skatiet jauno Peldošo etiķešu lapu.

  • Laušana Konsolidēti vietējie un pielāgotie veidlapas elementi. Izvēles rūtiņas, radio, atlases un citas ievades, kurām 4. versijā bija vietējās un pielāgotās klases, ir apvienotas. Tagad gandrīz visi mūsu veidlapas elementi ir pilnībā pielāgoti, vairumam nav nepieciešams pielāgots HTML.

    • .custom-checktagad ir .form-check.
    • .custom-check.custom-switchtagad ir .form-check.form-switch.
    • .custom-selecttagad ir .form-select.
    • .custom-fileun .form-fileir aizstāti ar pielāgotiem stiliem .form-control.
    • .custom-rangetagad ir .form-range.
    • Atkritusi dzimtā .form-control-fileun .form-control-range.

  • LaušanaNokrita .input-group-appendun .input-group-prepend. Tagad varat vienkārši pievienot pogas un .input-group-textkā ievades grupu tiešos atvasinājumus.

  • Ilgstošais trūkstošās robežas rādiuss ievades grupā ar validācijas atgriezeniskās saites kļūdu beidzot ir novērsts, pievienojot papildu .has-validationklasi ievades grupām ar validāciju.

  • Laušana Mūsu režģa sistēmai ir atmestas veidlapai raksturīgas izkārtojuma klases. Izmantojiet mūsu režģi un utilītas, nevis .form-group, .form-rowvai .form-inline.

  • LaušanaVeidlapu etiķetēm tagad ir nepieciešams .form-label.

  • Laušana .form-textvairs nenosaka display, ļaujot jums izveidot iekļautu vai bloķēt palīdzības tekstu pēc vēlēšanās, vienkārši mainot HTML elementu.

  • Validācijas ikonas vairs netiek lietotas <select>s ar multiple.

  • Pārkārtoti avota Sass faili zem scss/forms/, tostarp ievades grupu stili.

Sastāvdaļas

  • Vienotas paddingvērtības brīdinājumiem, hierarhiskā navigācijai, kartītēm, nolaižamajām izvēlnēm, sarakstu grupām, modāliem, uznirstošajiem logiem un rīka padomiem, kuru pamatā ir mūsu $spacermainīgais. Skatiet #30564 .

Akordeons

Brīdinājumi

  • Brīdinājumiem tagad ir piemēri ar ikonām .

  • Katrā brīdinājumā ir noņemti pielāgotie stili <hr>s, jo tie jau izmanto currentColor.

Nozīmītes

  • LaušanaAtmestas visas .badge-*krāsu klases fona utilītprogrammām (piem., izmantojiet .bg-primaryvietā .badge-primary).

  • LaušanaAtmests — tā vietā .badge-pillizmantojiet .rounded-pillutilītu.

  • LaušanaNoņemti kursora virzīšanas un fokusa stili elementiem <a>un <button>.

  • Palielināts noklusējuma polsterējums emblēmām no .25em/ .5emuz .35em/ .65em.

  • Vienkāršots rīvmaiņas noklusējuma izskats, noņemot padding, background-colorun border-radius.

  • Pievienots jauns pielāgots CSS rekvizīts --bs-breadcrumb-divider, lai to varētu viegli pielāgot bez nepieciešamības atkārtoti kompilēt CSS.

Pogas

  • Laušana Pārslēgšanas pogām , kurām ir izvēles rūtiņas vai radio, vairs nav nepieciešams JavaScript, un tām ir jauns marķējums. Mums vairs nav nepieciešams iesaiņojuma elements, pievienojiet.btn-checkto<input>un savienojiet to pārī ar jebkurām.btnklasēm<label>. Skatiet #30650 . Šim nolūkam paredzētie dokumenti ir pārvietoti no mūsu pogas pogas uz jauno sadaļu Veidlapas.

  • Laušana Atkrita .btn-blockpar komunālajiem pakalpojumiem. Tā vietā, lai izmantotu .btn-blockpogu .btn, aptiniet pogas ar .d-gridun .gap-*utilītu, lai pēc vajadzības tās novietotu. Pārslēdzieties uz adaptīvām nodarbībām, lai vēl vairāk kontrolētu tās. Izlasiet dažus piemērus dokumentos.

  • Atjaunināts mūsu button-variant()un button-outline-variant()mixins, lai atbalstītu papildu parametrus.

  • Atjauninātas pogas, lai nodrošinātu lielāku kontrastu kursora novietošanas un aktīvajā stāvoklī.

  • Atspējotajām pogām tagad ir pointer-events: none;.

Kart

  • LaušanaNokrita .card-deckpar labu mūsu tīklam. Aptiniet kārtis kolonnu klasēs un pievienojiet vecākkonteineru .row-cols-*, lai atkārtoti izveidotu kāršu komplektus (bet ar lielāku kontroli pār adaptīvo izlīdzināšanu).

  • LaušanaAtkrita .card-columnspar labu Mūrniecībai. Skatiet #28922 .

  • Laušana.cardPamatotais akordeons tika aizstāts ar jaunu Akordeona komponentu .

  • Pievienots jauns .carousel-darkvariants tumšam tekstam, vadīklām un indikatoriem (lieliski piemērots gaišākiem foniem).

  • Karuseļa vadīklām ir nomainītas ševronu ikonas ar jauniem SVG no Bootstrap Icons .

Aizvērt poga

  • LaušanaPārdēvēts .closepar .btn-closemazāk vispārīgu nosaukumu.

  • Aizvērt pogas tagad izmanto background-image(iegulto SVG), nevis a &times;HTML, ļaujot vieglāk pielāgot, nepieskaroties marķējumam.

  • Pievienots jauns .btn-close-whitevariants, kas tiek izmantots filter: invert(1), lai iespējotu augstāku kontrastu, lai izslēgtu ikonas uz tumšāka fona.

Sakļaut

  • Noņemts ritināšanas stiprinājums akordeoniem.

  • Pievienots jauns .dropdown-menu-darkvariants un saistītie mainīgie tumšajiem nolaižamajiem izvēlnēm pēc pieprasījuma.

  • Pievienots jauns mainīgais $dropdown-padding-x.

  • Lai uzlabotu kontrastu, nolaižamais dalītājs ir padarīts tumšāks.

  • LaušanaVisi nolaižamās izvēlnes notikumi tagad tiek aktivizēti nolaižamās izvēlnes pārslēgšanas pogā un pēc tam tiek parādīti līdz vecākajam elementam.

  • Nolaižamajām izvēlnēm tagad ir data-bs-popper="static"iestatīts atribūts, kad nolaižamās izvēlnes pozīcija ir statiska un nolaižamā izvēlne data-bs-popper="none"atrodas navigācijas joslā. To pievieno mūsu JavaScript, un tas palīdz mums izmantot pielāgotus pozīciju stilus, netraucējot Poppera pozicionēšanai.

  • LaušanaNolaižamā spraudņa flipopcija ir atmesta par labu vietējai Popper konfigurācijai. Tagad varat atspējot apvēršanas darbību, nododot tukšu masīvu fallbackPlacementsopcijai apvēršanas modifikatorā.

  • Nolaižamajās izvēlnēs tagad var noklikšķināt, izmantojot jaunu autoCloseopciju automātiskās aizvēršanas darbībai . Varat izmantot šo opciju, lai pieņemtu klikšķi nolaižamajā izvēlnē vai ārpus tās, lai padarītu to interaktīvu.

  • Nolaižamās izvēlnes tagad atbalsta .dropdown-items, kas ietīts ar <li>s.

Džumbotrons

Saraksta grupa

  • Klasei pievienoti jauni nullmainīgie font-size, font-weight, colorun .:hover color.nav-link
  • LaušanaNavigācijas joslās tagad ir nepieciešams konteiners (lai krasi vienkāršotu atstarpes prasības un nepieciešama CSS).

Offcanvas

Lapu šķirošana

  • Lappuses saites tagad ir pielāgojamas margin-left, un tās tiek dinamiski noapaļotas visos stūros, kad tās ir atdalītas viena no otras.

  • Pievienots transitions lappušu saitēm.

Popovers

  • LaušanaMūsu noklusējuma uznirstošajā veidnē pārdēvēts .arrowpar ..popover-arrow

  • whiteListOpcija pārdēvēta par allowList.

Spinneri

  • Spinneri tagad godina prefers-reduced-motion: reduce, palēninot animācijas. Skatiet #31882 .

  • Uzlabota spinera vertikālā izlīdzināšana.

Tosti

  • Tagad grauzdiņus var novietot a .toast-container, izmantojot pozicionēšanas utilītus .

  • Noklusējuma grauzdēšanas ilgums ir mainīts uz 5 sekundēm.

  • Noņemts overflow: hiddenno grauzdiņiem un aizstāts ar atbilstošām border-radiuss ar calc()funkcijām.

Rīku padomi

  • LaušanaMūsu noklusējuma rīka padoma veidnē pārdēvēts .arrowpar ..tooltip-arrow

  • LaušanaNoklusējuma vērtība fallbackPlacementstiek mainīta uz ['top', 'right', 'bottom', 'left'], lai labāk novietotu poppera elementus.

  • LaušanawhiteListOpcija pārdēvēta par allowList.

Komunālie pakalpojumi

  • LaušanaPārdēvētas vairākas utilītas, lai virzienu nosaukumu vietā izmantotu loģiskus rekvizītu nosaukumus, pievienojot RTL atbalstu:

    • Pārdēvēts .left-*un .right-*uz .start-*un .end-*.
    • Pārdēvēts .float-leftun .float-rightuz .float-startun .float-end.
    • Pārdēvēts .border-leftun .border-rightuz .border-startun .border-end.
    • Pārdēvēts .rounded-leftun .rounded-rightuz .rounded-startun .rounded-end.
    • Pārdēvēts .ml-*un .mr-*uz .ms-*un .me-*.
    • Pārdēvēts .pl-*un .pr-*uz .ps-*un .pe-*.
    • Pārdēvēts .text-leftun .text-rightuz .text-startun .text-end.

  • LaušanaPēc noklusējuma ir atspējotas negatīvās piemales.

  • Pievienota jauna .bg-bodyklase, lai ātri iestatītu <body>fona papildu elementus.

  • Pievienotas jaunas pozīcijas utilītas , top, rightun bottom. leftVērtības ietver 0, 50%, un 100%katram īpašumam.

  • Pievienotas jaunas .translate-middle-xun .translate-middle-yutilītas, lai horizontāli vai vertikāli centrētu absolūtos/fiksētos elementus.

  • Pievienotas jaunas border-widthutilītas .

  • LaušanaPārdēvēts .text-monospacepar .font-monospace.

  • LaušanaNoņemts .text-hide, jo tā ir novecojusi teksta slēpšanas metode, kuru vairs nevajadzētu izmantot.

  • Pievienotas .fs-*utilītas font-sizeutilītprogrammām (ar iespējotu RFS). Tie izmanto tādu pašu mērogu kā HTML noklusējuma virsraksti (1–6, no lieliem līdz maziem), un tos var mainīt, izmantojot Sass karti.

  • LaušanaPārdēvēti .font-weight-*komunālie pakalpojumi, .fw-*lai nodrošinātu īsumu un konsekvenci.

  • LaušanaPārdēvēti .font-style-*komunālie pakalpojumi, .fst-*lai nodrošinātu īsumu un konsekvenci.

  • Pievienots .d-grid, lai parādītu utilītas un jaunas gaputilītas ( .gap) CSS Grid un flexbox izkārtojumiem.

  • LaušanaNoņemts .rounded-smun rounded-lg, kā arī ieviesta jauna klašu skala .rounded-0uz .rounded-3. Skatiet #31687 .

  • Pievienotas jaunas line-heightutilītas: .lh-1, .lh-sm, .lh-baseun .lh-lg. Skatīt šeit .

  • Pārvietoja .d-noneutilītu mūsu CSS, lai piešķirtu tai lielāku nozīmi salīdzinājumā ar citām displeja utilītprogrammām.

  • Paplašināja .visually-hidden-focusablepalīgu, lai strādātu arī ar konteineriem, izmantojot :focus-within.

Palīgie

  • Laušana Adaptīvie iegulšanas palīgi ir pārdēvēti par attiecību palīgiem ar jauniem klašu nosaukumiem un uzlabotu uzvedību, kā arī noderīgu CSS mainīgo.

    • Klases ir pārdēvētas, lai mainītu bymalu xattiecību. Piemēram, .ratio-16by9tagad ir .ratio-16x9.
    • Mēs esam atteikušies no .embed-responsive-itemelementu grupas atlasītāja un par labu vienkāršākam .ratio > *atlasītājam. Vairāk klases nav vajadzīgas, un attiecību palīgs tagad darbojas ar jebkuru HTML elementu.
    • $embed-responsive-aspect-ratiosSass karte ir pārdēvēta par un $aspect-ratiostās vērtības ir vienkāršotas, iekļaujot klases nosaukumu un procentuālo attiecību kā key: valuepāri.
    • CSS mainīgie tagad ir ģenerēti un iekļauti katrai vērtībai Sass kartē. Modificējiet --bs-aspect-ratiomainīgo, .ratiolai izveidotu jebkuru pielāgotu malu attiecību .

  • Laušana “Ekrāna lasītāja” klases tagad ir “vizuāli slēptās” klases .

    • Sass fails ir mainīts no scss/helpers/_screenreaders.scssuzscss/helpers/_visually-hidden.scss
    • Pārdēvēts .sr-onlyun .sr-only-focusableuz .visually-hiddenun.visually-hidden-focusable
    • Pārdēvēts sr-only()un sr-only-focusable()miksēts uz visually-hidden()un visually-hidden-focusable().

  • bootstrap-utilities.csstagad arī mūsu palīgi. Palīgi vairs nav jāimportē pielāgotās versijās.

JavaScript

  • Tika pārtraukta jQuery atkarība un pārrakstīti spraudņi, lai tie būtu parastajā JavaScript.

  • LaušanaDatu atribūti visiem JavaScript spraudņiem tagad ir nosaukumos, lai palīdzētu atšķirt Bootstrap funkcionalitāti no trešajām pusēm un jūsu koda. Piemēram, mēs data-bs-toggleizmantojam data-toggle.

  • Visi spraudņi tagad var pieņemt CSS atlasītāju kā pirmo argumentu. Lai izveidotu jaunu spraudņa gadījumu, varat nodot DOM elementu vai jebkuru derīgu CSS atlasītāju:

    var modal = new bootstrap.Modal('#myModal')
var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')

  • popperConfigvar tikt nodota kā funkcija, kas pieņem Bootstrap noklusējuma Popper konfigurāciju kā argumentu, lai jūs varētu apvienot šo noklusējuma konfigurāciju savā veidā. Attiecas uz nolaižamajām izvēlnēm, uznirstošajiem logiem un rīka padomiem.

  • Noklusējuma vērtība fallbackPlacementstiek mainīta uz ['top', 'right', 'bottom', 'left'], lai labāk novietotu Popper elementus. Attiecas uz nolaižamajām izvēlnēm, uznirstošajiem logiem un rīka padomiem.

  • Noņemta pasvītra no publiskajām statiskajām metodēm, piemēram, _getInstance()→ getInstance().