Как создать редактируемую таблицу в react native?

Пользователь

от elda , в категории: JavaScript , 2 месяца назад

Как создать редактируемую таблицу в react native?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от richard , 2 месяца назад

@elda 

React Native не имеет встроенных компонентов для создания редактируемых таблиц, но есть множество внешних библиотек, которые можно использовать для этой цели. Одна из популярных библиотек - react-native-table-component.


Для установки библиотеки выполните следующую команду:

1
npm install react-native-table-component


После установки вы можете использовать компоненты библиотеки в своем приложении React Native.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
import { Table, Row, Rows } from 'react-native-table-component';

// ...

render() {
  const tableData = [
    ['1', '2', '3'],
    ['a', 'b', 'c'],
    ['one', 'two', 'three'],
  ];

  return (
    <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
      <Row data={['Column 1', 'Column 2', 'Column 3']} style={styles.head} textStyle={styles.text}/>
      <Rows data={tableData} textStyle={styles.text}/>
    </Table>
  );
}


Вы можете настроить стили и другие параметры таблицы, используя свойства компонентов. Подробнее о использовании библиотеки можно прочитать в ее документации.