diff --git a/examples/ReactExample/components/styles.js b/examples/ReactExample/components/styles.js
index 798b9eef..47bab8a4 100644
--- a/examples/ReactExample/components/styles.js
+++ b/examples/ReactExample/components/styles.js
@@ -10,7 +10,6 @@ module.exports = React.StyleSheet.create({
backgroundColor: '#ffffff',
},
listItem: {
- paddingRight: 12,
borderColor: "#c8c7cc",
borderBottomWidth: 0.5,
alignItems: 'stretch',
@@ -45,6 +44,12 @@ module.exports = React.StyleSheet.create({
flex: 1,
lineHeight: 30,
},
+ listItemDelete: {
+ paddingLeft: 12,
+ paddingRight: 12,
+ flexDirection: 'column',
+ justifyContent: 'center',
+ },
instructions: {
textAlign: 'center',
color: '#333333',
diff --git a/examples/ReactExample/components/todo-item-delete.js b/examples/ReactExample/components/todo-item-delete.js
new file mode 100644
index 00000000..4a260d4b
--- /dev/null
+++ b/examples/ReactExample/components/todo-item-delete.js
@@ -0,0 +1,20 @@
+'use strict';
+
+const React = require('react-native');
+const styles = require('./styles');
+
+const { Text, TouchableWithoutFeedback, View } = React;
+
+class TodoItemDelete extends React.Component {
+ render() {
+ return (
+
+
+ 𐄂
+
+
+ );
+ }
+}
+
+module.exports = TodoItemDelete;
diff --git a/examples/ReactExample/components/todo-item.js b/examples/ReactExample/components/todo-item.js
index 710fd537..988b7240 100644
--- a/examples/ReactExample/components/todo-item.js
+++ b/examples/ReactExample/components/todo-item.js
@@ -2,6 +2,7 @@
const React = require('react-native');
const TodoItemCheckbox = require('./todo-item-checkbox');
+const TodoItemDelete = require('./todo-item-delete');
const realm = require('./realm');
const styles = require('./styles');
@@ -26,6 +27,7 @@ class TodoItem extends React.Component {
render() {
let item = this.props.item;
+ let deleteButton;
let contents;
if (this.props.editing) {
@@ -48,12 +50,17 @@ class TodoItem extends React.Component {
{item.text}
);
+
+ deleteButton = (
+
+ );
}
return (
{contents}
+ {deleteButton}
);
}
diff --git a/examples/ReactExample/components/todo-list.js b/examples/ReactExample/components/todo-list.js
index c292f2d9..af06dacc 100644
--- a/examples/ReactExample/components/todo-list.js
+++ b/examples/ReactExample/components/todo-list.js
@@ -39,6 +39,7 @@ class TodoList extends React.Component {
item={item}
editing={this.state.editingRow == rowIndex}
onPress={() => this._onPressRow(rowIndex)}
+ onPressDelete={() => this._onPressDeleteRow(rowIndex)}
onEndEditing={() => this._onEndEditingRow(rowIndex)} />
);
}
@@ -53,6 +54,14 @@ class TodoList extends React.Component {
this.setState({editingRow: rowIndex});
}
+ _onPressDeleteRow(rowIndex) {
+ let items = this.props.list.items;
+
+ realm.write(() => items.splice(rowIndex, 1));
+
+ this.forceUpdate();
+ }
+
_onEndEditingRow(rowIndex) {
let items = this.props.list.items;