Comments (8)
@Wowoy npm install --save git://github.com/ollija/react-native-sortable-grid.git
will install the latest commit on the default branch.
from react-native-sortable-grid.
I am currently facing the same problem.
I have this component:
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SortableGrid from 'react-native-sortable-grid'
import AddPhoto from '../components/AddPhoto'
class ImageGrid extends Component {
static propTypes = {
pressAddPhoto: PropTypes.func.isRequired,
deleteImage: PropTypes.func.isRequired,
orderImages: PropTypes.func.isRequired,
imageFields: PropTypes.array.isRequired,
images: PropTypes.object.isRequired,
}
render () {
return (
<SortableGrid
itemsPerRow={4}
onDragRelease={itemOrder => this.props.orderImages(itemOrder.itemOrder)}
doubleTapTreshold={300}
>
{this.props.imageFields.map((fieldname, index) =>
<AddPhoto
key={index}
onTap={() => this.props.pressAddPhoto()}
onDoubleTap={() => this.props.deleteImage(index)}
source={this.props.images[fieldname]}
/>,
)}
</SortableGrid>
)
}
}
export default ImageGrid
What should happen
When tapping an item in the grid once, it opens the camera roll.
I select an image and the image is saved.
Through saving the new image in the parent component, the "images" prop updates.
The image should be visible in the grid.
What actually happens
The state change is successful, the prop is updated, but the image is not visible.
What I've tried
I replaced the SortableGrid
component with a View
and when the app hot reloads, it instantly shows the images as it's supposed to. When I put SortableGrid
back (and it re-renders again), it does show the right images still.
I tried to call forceUpdate()
on the ImagedGrid
component, on the SortableGrid
and on the AddPhoto
components, but it didn't help.
from react-native-sortable-grid.
Never mind. It works when installing the latest commit! 👍
FYI: @brianlaw033
from react-native-sortable-grid.
I have tried, but it didn't work.Could you tell me how you did it ?@dkaufhold
from react-native-sortable-grid.
So have you solved this problem?@brianlaw033
from react-native-sortable-grid.
Ok,it works.Thank you very much!@dkaufhold
from react-native-sortable-grid.
has the latest commit been merged into master?
from react-native-sortable-grid.
不要用index 做key,就解决,但是没有删除动画
from react-native-sortable-grid.
Related Issues (20)
- Drag and Drop fails and the Grid collapses. HOT 3
- Drag icons in a long ScrollView with autoscroll HOT 2
- Still supported? HOT 3
- onDragStart not working with delete functionality?
- How to make draggable item clickable?
- want some inactive items not to be sorted, inactive property is not working HOT 5
- Can i Add outside item to items inside grid? HOT 1
- Android performance is sluggish and unusable HOT 1
- different quantities of items in different rows HOT 9
- how to slide item to left or right and delete
- Is there an example where item values change on reorder? HOT 1
- Add an item HOT 1
- inactive props doesn't work for me HOT 3
- how to set inactive = false. to it's child HOT 5
- Deprecated Lifecycle Method .....Warning: componentWillReceiveProps has been renamed... HOT 1
- scroll grid not work
- When will the latest commit be merged into master?
- restrict to one movement
- Not working with TouchableOpacity/Pressable
- Customize number of items in each column/row
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-sortable-grid.