react-native-writebox
Thành phần ReactNative để hiển thị textarea giống Facebook/Twitter ở phía dưới màn hình với bộ đếm ký tự.
Thành phần cơ bản để hiển thị textarea ở phía dưới màn hình sẽ tự động mở rộng vài dòng khi người dùng nhập nhiều nội dung hơn chúng ta có thể hiển thị – cũng có bộ đếm ký tự có thể hiển thị số ký tự còn lại.
Cài đặt
npm install react-native-writebox --save
Yarn:
yarn add react-native-writebox
Ví dụ sử dụng
Sử dụng cơ bản:
import React, { Component } from 'react'
import WriteBox from 'react-native-writebox'
export default class Demo extends Component {
render() {
return (
<WriteBox onSubmit={ ({ value }) => { console.log('Input value', value) } } >
{ this.props.children }
</WriteBox>
)
}
}
| Thuộc tính | Kiểu | Giá trị mặc định | Mô tả |
|---|---|---|---|
| onSubmit | function | Khi nhấn Hoàn tất hoặc nút lưu bên phải, hàm này sẽ được gọi với giá trị của textarea là đối số đầu tiên |
|
| onBlur | function | ||
| onFocus | function | ||
| submitLabel | string | ‘Gửi’ | Văn bản của nút bên phải |
| placeholder | string | ‘Nhập ở đây …’ | Văn bản của textarea sẽ hiển thị khi không có giá trị nào |
| inputLimit | number | undefined | Nếu được đặt, đây là số lượng ký tự tối đa có thể được nhập vào textarea – sau đó bộ đếm sẽ trở thành màu đỏ và bắt đầu đếm giá trị âm |
| autoFocus | boolean | false | Khi thành phần kết thúc việc render, nó sẽ tự động đặt tiêu điểm vào khu vực văn bản và mở bàn phím |
| value | string | ” | Giá trị của textarea khi bắt đầu |
| clearOnSubmit | boolean | false | Khi gửi textarea nếu được đặt thành true, giá trị của thành phần sẽ được đặt thành undefined |
Tác giả
Bozhidar Dryanovski – @dryanovski
Phân phối dưới giấy phép ISC. Xem LICENSE để biết thêm thông tin.
https://github.com/bdryanovski/react-native-writebox
Đóng góp
. Fork nó (https://github.com/bdryanovski/react-native-writebox/fork)
. Tạo nhánh tính năng của bạn (git checkout -b feature/fooBar)
. Commit các thay đổi của bạn (git commit -am 'Thêm một số fooBar')
. Đẩy lên nhánh (git push origin feature/fooBar)
. Tạo một Pull Request mới
Chi tiết Tải về:
Tác giả: bdryanovski
Nguồn: https://github.com/bdryanovski/react-native-writebox
Giấy phép: ISC license
