react wired elements

Elemen-elemen yang bereaksi

Elemen kabel sebagai komponen reaksi.

• Bagus untuk prototipe cepat
• Tipe TypeScript disertakan?

Demo buku cerita

Demo buku cerita mencakup contoh interaktif serta dokumentasi terperinci untuk alat peraga dan penggunaan masing -masing komponen.

Wired Elements adalah perpustakaan yang sangat keren yang menyediakan komponen web dengan tampilan wireframe menggunakan SVGS. Perpustakaan ini membungkus masing -masing elemen kabel dalam komponen bereaksi dan memperlihatkan atribut, metode, dan opsi penataan yang tersedia sebagai alat peraga (sebaik mungkin).

Instalasi

Langkah 1. Instal perpustakaan ini dengan menggunakan yarn atau npm .

 yarn add react-wired-elements

Langkah 2. Sertakan file CSS ikon materi di kepala file HTML utama Anda.

 < head >
  < link
    href =" https://fonts.googleapis.com/css?family=Material+Icons&display=block "
    rel =" stylesheet "
  />
</ head > 

Penggunaan

 import React from 'react' ;
import { WiredCard , WiredButton } from 'react-wired-elements' ;

const App = ( ) => {
  return (
    < WiredCard fill = "#F5F5F5" elevation = { 3 } >
      < WiredButton onClick = { handleSubmit } > Submit </ WiredButton >
    </ WiredCard >
  ) ;
} ;

Lihat demo buku cerita untuk contoh interaktif dan definisi prop rinci dan instruksi penggunaan.

Berikut adalah daftar lengkap komponen. Klik setiap komponen yang akan diarahkan ke contoh buku cerita itu.

• WiredButton
• WiredCalendar
• WiredCard
• WiredCheckBox
• WiredCombo
• WiredDialog
• WiredDivider
• Wiredfab
• WirediconButton
• WiredImage
• WiredInput
• WiredItem
• WiredLink
• WiredListBox
• WiredProgress
• WiredRadio
• WiredRadiogroup
• WiredSearchInput
• WiredSlider
• WiredSpinner
• WiredTab
• WiredTabs
• WiredTextArea
• WiredToggle
• WiredVideo

Perbedaan dan masalah yang diketahui

Ada beberapa perbedaan penamaan dan fungsi antara elemen kabel dan perpustakaan ini. Hal ini disebabkan, sebagian, karena perbedaan dalam cara kerja komponen reaksi dan web serta upaya untuk mengikuti konvensi/pola penamaan yang umum dalam bereaksi. Karena ini adalah komponen web, mereka mengirimkan peristiwa asli sebagai lawan dari peristiwa sintetis bereaksi.

• maxRows Prop pada komponen WiredTextArea tidak berfungsi
• firstDate dan lastDate tidak bekerja pada WiredCalendar