Update Tinder.js
This commit is contained in:
parent
18b3e0b819
commit
1cd3aaa6ab
@ -1,4 +1,4 @@
|
||||
import React, {useEffect, useState} from 'react';
|
||||
import React, {useState} from 'react';
|
||||
import TinderCard from 'react-tinder-card';
|
||||
import './Tinder.css';
|
||||
|
||||
@ -23,40 +23,29 @@ const db = [
|
||||
id: 5,
|
||||
name: 'Dinesh Chugtai',
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
const Tinder = () => {
|
||||
const characters = db;
|
||||
const [lastDirection, setLastDirection] = useState();
|
||||
const [cardId, setCardId] = useState([]);
|
||||
|
||||
const swiped = (direction, nameToDelete, id) => {
|
||||
console.log('removing: ' + nameToDelete);
|
||||
const swiped = (direction, id) => {
|
||||
setLastDirection(direction);
|
||||
if (direction === 'right') {
|
||||
cardId.push(id);
|
||||
};
|
||||
console.log(cardId);
|
||||
};
|
||||
|
||||
const outOfFrame = (name) => {
|
||||
console.log(name + ' left the screen!');
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
let uniqueTags = [];
|
||||
if (cardId.length === 1) {
|
||||
uniqueTags = cardId.filter(function(elem, pos) {
|
||||
return cardId.indexOf(elem) === pos;})
|
||||
console.log(uniqueTags);
|
||||
}
|
||||
})
|
||||
// const getId = () => {
|
||||
// uniqueTags = cardId.filter(function(elem, pos) {
|
||||
// return cardId.indexOf(elem) === pos;
|
||||
// });
|
||||
// console.log(uniqueTags);
|
||||
// }
|
||||
let uniqueTags = [];
|
||||
|
||||
const getId = () => {
|
||||
uniqueTags = cardId.filter(function(elem, pos) {
|
||||
return cardId.indexOf(elem) === pos;
|
||||
});
|
||||
console.log(uniqueTags);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='tinder-container'>
|
||||
@ -66,8 +55,11 @@ const db = [
|
||||
<TinderCard
|
||||
className='swipe'
|
||||
key={character.id}
|
||||
onSwipe={(dir) => swiped(dir, character.name, character.id)}
|
||||
onCardLeftScreen={() => outOfFrame(character.name)}
|
||||
onSwipe={(dir) => {
|
||||
swiped(dir, character.id);
|
||||
getId();
|
||||
console.log(uniqueTags);
|
||||
}}
|
||||
>
|
||||
<div className='card'>
|
||||
<div
|
||||
|
Loading…
x
Reference in New Issue
Block a user