react-controlled-contenteditable v0.19.4

React Controlled Contenteditable

مكوّن ريأكت مضبوط للمحتوى القابل للتحرير

على عكس الحزم الأخرى ، فإن مكوّن ContentEditable هذا يمكن التحكم فيه بالكامل. مع القدرة على التنقل عبر عناصر html للتنسيق المتداخلة باستخدام مفاتيح الأسهم. وخلافا لحزمة react-contenteditable تستطيع استعمال useState من غير أن تواجه أي مشاكل.

التنصيب

npm i react-controlled-contenteditable

الخواص

ملاحظة: نوع KeyDownEvent يختلف عن React.KeyboardEvent من حيث أن الأول يأتي مع isComposing على عكس الأخير.

مثال

import {useState} from 'react';
import ContentEditable, {ContentEditableEvent} from './contentEditable';

function App() {
	const [content, setContent] = useState('');
	const handleChange = (e: ContentEditableEvent) => {
		setContent(e.target.value);
	};
	return (
		<div className="App">
			<ContentEditable
				onChange={handleChange}
				html={content}
				tagName="div"
			/>
		</div>
	);
}

export default App;

المساهمة

الباب مفتوح على مصرعيه للمساهمة.