Skip to content
This repository has been archived by the owner on Sep 16, 2020. It is now read-only.

Expo doesn't like react-native-swipeout #333

Open
eleallegue opened this issue Jun 10, 2019 · 1 comment
Open

Expo doesn't like react-native-swipeout #333

eleallegue opened this issue Jun 10, 2019 · 1 comment

Comments

@eleallegue
Copy link

I am coming here for help with the following problem:

I have this code: https://snack.expo.io/@guardme/1f5b93 you can look at it in that url, and anyway, I put it here:

import React, { Component } from 'react';
import { ScrollView, Image, Text, View, Platform } from 'react-native';
import { Icon } from 'expo';
import Swipeout from 'react-native-swipeout';

import styles from './styles';

var protegees = [];

export default class MyProtegeesScreen extends Component {
  componentWillMount() {
    this.loadUsers();
  }

  deleteAction = userInfo => {
    alert(userInfo.u_email);
  };

  loadUsers() {
    var aux = [
      {
        u_id: 'kajfdksnvkjs',
        u_email: '[email protected]',
        u_name: 'Pepa',
        u_surname: 'Perez',
        u_pic: 'https://facebook.github.io/react-native/img/favicon.png',
      },
      {
        u_id: 'kajsbciuksnrk',
        u_email: '[email protected]',
        u_name: 'Weee',
        u_surname: 'Paaaa',
        u_pic: 'https://facebook.github.io/react-native/img/favicon.png',
      },
    ];
    protegees = aux;
  }

  renderUsers() {
    return protegees.map(userInfo => {
      return (
        <Swipeout
          right={[
            {
              backgroundColor: '#fff',
              component: (
                <View style={styles.swipeoutSide}>
                  <Icon.Ionicons
                    size={30}
                    color="#dc3545"
                    name={
                      Platform.OS === 'ios' ? `ios-trash-outline` : 'md-trash'
                    }
                  />
                </View>
              ),
              onPress: () => {
                this.deleteAction(userInfo);
              },
            },
          ]}
          style={styles.swipe}>
          <View style={styles.container} key={userInfo.u_id}>
            <Image style={styles.avatar} source={{ uri: userInfo.u_pic }} />
            <View style={styles.containerUserData}>
              <Text style={styles.userName}>
                {userInfo.u_name} {userInfo.u_surname}
              </Text>
              <Text style={styles.userEmail}>{userInfo.u_email}</Text>
            </View>
          </View>
        </Swipeout>
      );
    });
  }

  render() {
    return <ScrollView>{this.renderUsers()}</ScrollView>;
  }
}

I was trying this code before entering it in my Expo app. When I introduce it there, Swipeout crashes the app with this error (it does not render, but when I remove the Swipeout part, it does):

image

And my dependencies are the following:

"dependencies": {
    "@expo/samples": "2.1.1",
    "braces": "^2.3.2",
    "expo": "^32.0.6",
    "expo-app-auth": "^3.0.0",
    "firebase": "^5.8.5",
    "react": "^16.8.6",
    "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",
    "react-native-elements": "^1.1.0",
    "react-native-gifted-chat": "^0.7.3",
    "react-native-paper": "^2.16.0",
    "react-native-phone-call": "^1.0.9",
    "react-native-swipeout": "^2.3.6",
    "react-navigation": "^3.0.9"
  },
@SirPhemmiey
Copy link

Hey @eleallegue , did you manage to fix this?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants