react-native-editable-list

An editable React list component

Usage no npm install needed!

<script type="module">
  import reactNativeEditableList from 'https://cdn.skypack.dev/react-native-editable-list';
</script>

README

react-native-editable-list

An editable list component for React Native.

NPM JavaScript Style Guide

Install

npm install --save react-native-editable-list

Usage

https://snack.expo.io/@phos-dev/react-native-editable-list

import React, { useState } from 'react';
import { StyleSheet, Text, View, FlatList, TextInput, TouchableOpacity } from 'react-native';
import EditableList from 'react-native-editable-list';

export default function App() {
  const [list, setList] = useState([]);
  return (
    <View style={styles.container}>
      <EditableList placeholder='Type something' onListChange={setList.bind(this)} list={list}/>
      <Text style={styles.data}> Data </Text>
      <Text> {list.length ? JSON.stringify(list) : 'Please, type something.'} </Text>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'yellow',
    alignItems: 'center',
    justifyContent: 'center',
    paddingTop: 40,
    paddingBottom: 40
  },
  data: {
      fontSize: 20
  }
});

License

MIT © phos-dev