react bootstrap typeahead ดาวน์โหลด - react bootstrap typeahead ดาวน์โหลดซอร์สโค้ด

react bootstrap typeahead

ซอร์สโค้ดอื่น ๆ

v6.3.2

ดาวน์โหลด

ตอบสนอง Bootstrap Typeahead

การพิมพ์ตาม React ที่ใช้ Bootstrap สำหรับการจัดสไตล์ และได้รับแรงบันดาลใจจาก typeahead.js ของ Twitter รองรับทั้งแบบเลือกเดี่ยวและแบบเลือกหลายรายการ และสอดคล้องกับแนวทางปฏิบัติในการเขียน WAI-ARIA ลองตัวอย่างสด

โปรดทราบว่าเอกสารและตัวอย่างใช้กับรุ่นล่าสุดและอาจใช้ไม่ได้อีกต่อไปหากคุณใช้เวอร์ชันเก่า

การติดตั้ง

 npm install --save react-bootstrap-typeahead

หรือ

 yarn add react-bootstrap-typeahead

รวมโมดูลในโครงการของคุณ:

 import { Typeahead } from 'react-bootstrap-typeahead' ; // ES2015
var Typeahead = require ( 'react-bootstrap-typeahead' ) . Typeahead ; // CommonJS

UMD บิลด์

รุ่นการพัฒนาและการใช้งานจริงจะรวมอยู่ในแพ็คเกจ NPM หรือคุณสามารถรับได้จาก CDNJS หรือ unpkg

เอกสารประกอบ

การใช้งานขั้นพื้นฐาน
ข้อมูล
การกรอง
กำลังแสดงผล
วิธีการสาธารณะ
API และอุปกรณ์ประกอบฉาก
คู่มือการอัพเกรด

ซีเอสเอส

แม้ว่าส่วนประกอบจะขึ้นอยู่กับ Bootstrap เป็นหลัก แต่ก็จำเป็นต้องมีสไตล์เพิ่มเติมบางอย่าง คุณควรรวมไฟล์ CSS ที่ให้มาในโครงการของคุณ:

 // Import as a module in your JS
import 'react-bootstrap-typeahead/css/Typeahead.css' ;

หรือ

 
< link
  rel =" stylesheet "
  href =" https://unpkg.com/react-bootstrap-typeahead/css/Typeahead.css "
/>

บูทสแตรป 5

ในความพยายามที่จะสนับสนุน Bootstrap 5 แพ็คเกจนี้ยังมีไฟล์ CSS ชื่อ Typeahead.bs5.css ซึ่งควรรวมไว้ข้างไฟล์ CSS พื้นฐานด้านบน

ตัวอย่าง

ลองใช้ตัวอย่างสด ซึ่งรวมถึงตัวอย่างโค้ดด้วย หากคุณต้องการแก้ไขตัวอย่าง ให้โคลนพื้นที่เก็บข้อมูลและรัน npm install และ npm start เพื่อสร้างไฟล์ตัวอย่าง จากนั้นคุณสามารถเปิดไฟล์ HTML ในเบราว์เซอร์ของคุณได้

คุณยังสามารถลองใช้ตัวอย่างแซนด์บ็อกซ์ต่อไปนี้ได้: