ጃቫስክሪፕት።
ኣብ jQuery ብዝተሃንጹ ኣማራጺ ጃቫስክሪፕት ፕላጊናትና ንቡትስትራፕ ህይወት ኣምጽእዎ። ብዛዕባ ነፍሲ ወከፍ ፕላግ-ኢን፡ ዳታናን ፕሮግራማዊ ኤፒኣይ ኣማራጺታትናን ካልእን ፍለጡ።
ፕላጊናት ብውልቂ ክካተቱ ይኽእሉ (Bootstrap's individual ብምጥቃም js/dist/*.js
), ወይ ኩሎም ብሓንሳብ ብምጥቃም bootstrap.js
ወይ እቲ ዝተቐነሰ bootstrap.min.js
(ክልቲኦም ኣይተካተቱ)።
bundler (Webpack, Rollup...) እንተተጠቒምካ /js/dist/*.js
፡ UMD ድሉዋት ዝኾኑ ፋይላት ክትጥቀም ትኽእል ኢኻ።
ገለ ፕላጊናትን CSS ኣካላትን ኣብ ካልኦት ፕላጊናት ይምርኮሱ። ፕላጊናት ብውልቂ እንተ ኣካቲትካዮም፡ ነዞም ጽግዕተኛታት ኣብቲ docs ምፍታሽካ ኣረጋግጽ። ከምኡ ውን ኩሎም ፕላጊናት ኣብ jQuery ከም ዝምርኮሱ ኣስተውዕል (እዚ ማለት jQuery ቅድሚ እቶም ፕላግ-ኢን ፋይላት ክካተት ኣለዎ )። ኣየኖት ስሪት ናይ jQuery ከም ዝድገፉ ንምርኣይ ናትና ተወከሱ ።package.json
ናትና ድሮፕዳውንስ፡ ፖፖቨርስን ቱልቲፕስን እውን ኣብ Popper.js ይምርኮሱ ።
ዳርጋ ኩሎም Bootstrap plugins ብመንገዲ HTML ጥራይ ምስ data attributes (እቲ እንመርጾ ኣገባብ ኣጠቓቕማ JavaScript functionality) ክኽፈሉን ክውነኑን ይኽእሉ። ኣብ ሓደ ባእታ ሓደ ስብስብ ናይ ዳታ ባህርያት ጥራይ ምጥቃምካ ኣረጋግጽ (ንኣብነት፡ ካብ ሓደ መጠወቒ ንመሳርሒ ምኽሪን ሞዳልን ክትጅምር ኣይትኽእልን ኢኻ።)
ይኹን እምበር ኣብ ገለ ኩነታት ነዚ ተግባር ምዕጻው ተመራጺ ክኸውን ይኽእል እዩ። ነቲ ናይ ዳታ ባህሪ ኤፒኣይ ንምስንኻል፡ ኩሎም ኣብቲ ሰነድ namespaced ብ data-api
like so ዝፍጸሙ ፍጻመታት ፍታሕ፤
ከም ኣማራጺ፡ ንሓደ ፍሉይ ፕላግ-ኢን ዕላማ ንምግባር፡ ስም ናይቲ ፕላግ-ኢን ከም ቦታ ስም ምስቲ data-api namespace ከምዚ ዝኣመሰለ ጥራይ ኣካትትዎ፤
ዝሃድሙ መምረጺታት
ፍሉያት መምረጺታት እንተተጠቒምካ፡ ንኣብነት: collapse:Example
፡ ርግጸኛ ኩን ምህዳምካ፡ ምኽንያቱ ብመንገዲ jQuery ክሓልፉ እዮም።
ቡትስትራፕ ንመብዛሕትኦም ፍሉያት ተግባራት ፕላጊናት ብሕታዊ ፍጻመታት ይህብ። ብሓፈሻ እዚኦም ብዘይውዳእን ሕሉፍ ረባሕታውን መልክዕ ይመጹ - ኣብዚ እቲ ዘይውዳእ (ex. show
) ኣብ መጀመርታ ናይ ሓደ ፍጻመ ይብገስ፣ ሕሉፍ ረባሕታኡ መልክዑ (ex. shown
) ድማ ምስ ምዝዛም ሓደ ተግባር ይብገስ።
ኩሎም ዘይውዳእ ፍጻመታት preventDefault()
ተግባር ይህቡ። እዚ ድማ ቅድሚ ምጅማሩ ምፍጻም ሓደ ተግባር ደው ናይ ምባል ዓቕሚ ይህብ። ካብ ሓደ ናይ ፍጻመ መተሓላለፊ ሓሶት ምምላስ ’ ውን ብኣውቶማቲክ ክጽውዕ preventDefault()
እዩ።
ብተወሳኺ ንኹሎም Bootstrap plugins ብጃቫስክሪፕት ኤፒኣይ ጥራይ ኣቢልካ ክትጥቀመሎም ክትክእል ኣለካ ኢልና ንኣምን። ኩሎም ህዝባዊ ኤፒኣይታት ንጽል፣ ብሰንሰለት ዝእሰሩ ኣገባባት እዮም፣ ከምኡውን ነቲ ዝተዋስአሉ እኽብካብ ይመልሱ።
ኩሎም ሜላታት ኣማራጺ ኣማራጺታት ነገራት ክቕበሉ ኣለዎም፣ ንፍሉይ ሜላ ዝዓለመ ሕብረ ቃላት፣ ወይ ዋላ ሓንቲ (ብነባሪ ባህሪ ፕላግ-ኢን ዘበግስ)፦
ነፍሲ ወከፍ ፕላግ-ኢን ንጥረ ሃናጺኡ ኣብ ሓደ Constructor
ንብረት እውን የቃልዕ: $.fn.popover.Constructor
. ፍሉይ ናይ ተወሰኽቲ ምሳሌ ክትረክብ እንተደሊኻ፡ ብቐጥታ ካብ ሓደ ባእታ ውሰዶ $('[rel="popover"]').data('popover')
፡ .
ኩሎም ፕሮግራማዊ ኤፒኣይ ሜላታት ዘይተመዓራረዩ ኮይኖም እቲ ምስግጋር ምስ ተጀመረ ግን ቅድሚ ምዝዛሙ ናብቲ ደዋሊ ይምለስ ።
እቲ ምስግጋር ምስ ተዛዘመ ሓደ ተግባር ንምፍጻም፡ ነቲ ዝምልከቶ ፍጻመ ክትሰምዕ ትኽእል።
ብተወሳኺ ኣብ ሓደ መሰጋገሪ ኣካል ዝግበር ናይ ሜላ ጻውዒት ዕሽሽ ክበሃል ’ ዩ ።
ናይ ሓደ ተወሰኽቲ ነባሪ ቅጥዕታት ናይቲ ተወሰኽቲ ነገራት ብምቕያር ክትቅይሮ ትኽእል ኢኻ Constructor.Default
፤
ሓደ ሓደ ግዜ Bootstrap plugins ምስ ካልኦት UI frameworks ምጥቃም የድሊ። ኣብ ከምዚ ኩነታት፡ ሓሓሊፉ ናይ ስም ቦታ ምግጫው ከጋጥም ይኽእል። .noConflict
እዚ እንተ ኣጋጢሙ ፡ ነቲ ዋጋኡ ክትመልሶ እትደሊ ፕላግ-ኢን ክትድውለሉ ትኽእል ኢኻ።
VERSION
ስሪት ናይ ነፍሲ ወከፍ ናይ Bootstrap jQuery ፕላግ-ኢናት ብመንገዲ ንብረት ናይቲ ፕላግ-ኢን ሃናጺ ክትረኽቦ ትኽእል ። ንኣብነት ንመሳርሒ ቲፕ ፕላግ-ኢን፤
ናይ ቡትስትራፕ ፕላጊናት ብፍላይ ጃቫስክሪፕት ምስ ዝስረዝ ብጸጋ ንድሕሪት ኣይወድቁን እዮም። ኣብዚ ጉዳይ እዚ ብዛዕባ ተመኩሮ ተጠቃሚ ትግደስ እንተኾንካ <noscript>
፡ ነቲ ኩነታት ንምግላጽ (ከምኡ’ውን ከመይ ጌርካ ጃቫስክሪፕት ዳግማይ ከም እተኽእሎ) ንተጠቀምትኻ ንምግላጽ፡ ከምኡ’ውን/ወይ ናይ ገዛእ ርእስኻ ብሕታዊ ምምላስ ንምውሳኽ ተጠቐም።
ናይ ሳልሳይ ወገን ቤተ መጻሕፍቲ
ቡትስትራፕ ከም ፕሮቶታይፕ ወይ jQuery UI ዝኣመሰሉ ናይ ሳልሳይ ወገን ጃቫስክሪፕት ቤተ-መጻሕፍቲ ብወግዒ ኣይድግፍን እዩ ። ዋላ እኳ .noConflict
እንተሃለዉን ብስም ዝተቐመጡን ፍጻመታት፡ ባዕልኻ ክትእርሞም ዘለካ ናይ ምትእስሳር ጸገማት ክህልዉ ይኽእሉ እዮም።
ኩሎም ናይ Bootstrap ናይ ጃቫስክሪፕት ፋይላት ዝምርኮሱ util.js
ኮይኖም ጎኒ ጎኒ እቶም ካልኦት ናይ ጃቫስክሪፕት ፋይላት ክሕወስ ኣለዎ። ነቲ ዝተጠርነፈ (ወይ ዝተቐነሰ) ትጥቀም እንተኾንካ bootstrap.js
፡ ነዚ ምሕዋስ ኣየድልን እዩ-ድሮ ኣሎ።
util.js
ንጥቕሚ ዝኸውን ተግባራትን transitionEnd
ንፍጻመታት ዝኸውን መሰረታዊ ሓጋዚን ከምኡ’ውን ናይ CSS ምስግጋር ኤሙለተርን የጠቓልል። እቶም ካልኦት ፕላጊናት ንናይ CSS ምስግጋር ደገፍ ንምፍታሽን ንዝተሰቕሉ ምስግጋራት ንምሓዝን ይጥቀሙሉ።