Closed generalpaulinski closed 6 years ago
Maybe you should share your code with us to help us to understand your problem, we cannot guess there
faced same issue.
import React, { Component } from 'react';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import Cards, { Card } from 'react-swipe-card'
import '../../styles/common/cards/cards.css';
class Home extends Component {
action(name) {
console.log(name);
}
render() {
let {names} = this.props.homeState;
return (
<div className="b-content">
<Cards onEnd={()=>{this.action('end')}} className='master-root'>
{names.map((item, i) =>
<Card key={i}
onSwipeLeft={()=>{this.action('swipe left')}}
onSwipeRight={()=>{this.action('swipe right')}}>
<h2>{item}</h2>
</Card>
)}
</Cards>
</div>
)
}
}
function mapStateToProps(state) {
return {
homeState: state.homeState
};
}
function matchDispatchToProps(dispatcher) {
return bindActionCreators({}, dispatcher);
}
export default connect(mapStateToProps, matchDispatchToProps)(Home);
Error log: http://prntscr.com/hjtq92
Are width and height of Cards and Card components set ?
Hello,
yes. I'm using your css styles
2017-12-08 18:41 GMT+03:00 Aymeric Toulouse notifications@github.com:
Are width and height of Cards and Card components set ?
— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/alexandre-garrec/react-swipe-card/issues/17#issuecomment-350294565, or mute the thread https://github.com/notifications/unsubscribe-auth/AC7sCg6Wi35_fbTcVT_g2CMyK1whh_Thks5s-Vi-gaJpZM4Q2CpE .
@generalpaulinski I have the same problem. Have you found a solution?
@jksyrek sadly not :( but will let you know if I find anything...
I think that I had this problem in the beginning and I quickly resolved it but I dont know how, sorry, and I can't reproduce it either, keep hope 😆
I solved this issue. Make react and react-dom version 15.4.2 Make your functional component ES6 class Copy style.css from stories directory
therepo90, thanks! Your solution works fine.
thanks! works for me too :)
I tried @therepo90 solution but can't make it work.
Here is my code :
import React, { Component } from 'react';
import Cards, { Card } from 'react-swipe-card'
export default class SwipePage extends Component {
render() {
const data = ['Alexandre', 'Thomas', 'Lucien']
return(
<div>
<Cards onEnd={action('end')} className='master-root'>
{data.map(item =>
<Card
onSwipeLeft={action('swipe left')}
onSwipeRight={action('swipe right')}>
<h2>{item}</h2>
</Card>
)}
</Cards>
</div>
)
}
export function action(action) {
// body...
return 1;
}
Do you know what I'm doing wrong ?
Thanks a lot in advance for your kind reply :)
I get an Uncaught TypeError: Cannot read property 'offsetWidth' of null. The size of the cards is set, also the divs size and the body size. What can i do to fix it?