Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Support for react native web

See original GitHub issue

Issue Description

✅I have completed ALL installation steps.

Describe the bug Trying to use with react-native-web, not sure if this package is supported for web so this might be a feature request.

To Reproduce import DraggableFlatList from 'react-native-draggable-flatlist'

Platform & Dependencies Please list any applicable dependencies in addition to those below (react-navigation etc).

Platform: web
React Native version: ^0.60.5
React Native web version: ^0.11.7
Reanimated version: ^1.7.0
React Native Gesture Handler version: ^1.5.3

Additional context Using create-react-app. Getting this error

Failed to compile.

./node_modules/react-native-draggable-flatlist/index.tsx 69:5
Module parse failed: Unexpected token (69:5)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| };
| 
> type AnimatedFlatListType<T> = { getNode: () => RNFlatList<T> };
| 
| export type DragEndParams<T> = {

Issue Analytics

State:
Created 3 years ago
Reactions:7
Comments:13 (5 by maintainers)

Top GitHub Comments

7reactions

ianmartorellcommented, Apr 7, 2020

I created a blank Expo project and copy pasted the example, and it runs without any errors. The functionality seems to be broken though. Long-pressing an item moves it to the top of the list and locks it in the dragging state even if the finger is released, blocking interaction with other items too. Any idea how to go about fixing it? Here’s the repo.

ezgif-3-a760f63fc90e

I’m also thinking the dragging functionality should work differently when tapping on a touchscreen and dragging with a mouse (don’t need to wait for a longpress with a mouse), but I’m not sure if that’s even possible to achieve with RNGH.

5reactions

tettoffensivecommented, May 19, 2020

Sounds like this currently doesn’t work for react-native-web. Anyone know a good alternative for now?

Top Results From Across the Web

Introduction to React Native for Web

React Native for Web is a compatibility layer between React DOM and React Native. It can be used in new and existing apps,...

The complete guide to React Native for Web - LogRocket Blog

Create React App is the standard way to bootstrap web-only React applications. Although it comes with built-in support for aliasing react-native ...

React Native For Web Is What You Need For Your Multiplatform

Yes certainly, React Native, which is a cross-platform app development framework, can also be used to develop web applications. Is React Native ......

React Native · Learn once, write anywhere

React components wrap existing native code and interact with native APIs via React's declarative UI paradigm and JavaScript. This enables native app development ......

necolas/react-native-web: Cross-platform React UI packages

Cross-platform React UI packages. Contribute to necolas/react-native-web development by creating an account on GitHub.