react flash change

การเปลี่ยนแปลงแบบฟลาช

แฟลชคอนเทนเนอร์บนอุปกรณ์ประกอบฉากเปลี่ยน

การสาธิต

นี่คือหน้าตัวอย่าง

มีแหล่งที่มาใน ./storybook

ติดตั้ง

 # Yarn
yarn add @avinlab/react-flash-change

# NPM
npm install --save @avinlab/react-flash-change

การใช้งาน

 import React from 'react' ;
import FlashChange from '@avinlab/react-flash-change' ;

const Component = ( { value } ) => {
    < FlashChange
        value = { value }
        flashClassName = "flashing"
        compare = { ( prevProps , nextProps ) => {
            return nextProps . value !== prevProps . value ;
        } }
    >
        < span > { value } </ span >
    </ FlashChange > ;
} ; 

API

อุปกรณ์ประกอบฉาก

คุณสมบัติ	พิมพ์	ที่จำเป็น?	คำอธิบาย
เปรียบเทียบ	การทำงาน		ฟังก์ชั่นเพื่อเปรียบเทียบอุปกรณ์ประกอบฉากก่อนและหลังการอัปเดตเพื่อแก้ไขแฟลชหรือไม่ ฟังก์ชั่นพารามิเตอร์: (prevProps, nextProps) ค่าเริ่มต้นมันเปรียบเทียบ props.value หากสตริงส่งคืน - มันจะเป็นคลาสแฟลช
FlashDuration	ตัวเลข		ระยะเวลาของ "แฟลช"-ผลใน MS ค่าเริ่มต้น: 200ms
flashclassname	สาย		Flash-Effect ClassName
แฟลช	วัตถุ		วัตถุสไตล์แฟลชเอฟเฟกต์
ชื่อชั้นเรียน	สาย		ชื่อคลาส CSS แบบกำหนดเองที่กำหนดเอง
สไตล์	วัตถุ		สไตล์อินไลน์เสริม
OuterelementType	ตอบสนอง $ elementType		ชื่อแท็กส่งผ่านไปยัง Document.createElement เพื่อสร้างองค์ประกอบคอนเทนเนอร์ด้านนอก ค่าเริ่มต้น: div

ใบอนุญาต

mit © avin