Question

我正在将react-js项目移植到本地反应中。我想重用react-click-outside库。但是在将其添加到我的依赖项并使用handleClickOutside()方法时，我会考虑以下问题。错误消息是：

开发服务器返回响应错误代码：500

URL：   http://10.0.2.2:8081/index.android.bundle?platform=android&dev=true&hot=false&minify=false

正文：{“message”：“无法解决模块反应   /Users/xxx/ReactNativeProjects/react_native_prototype/node_modules/react-click-outside/dist/index.js：   模块映射或这些目录中不存在模块：\ n   /用户/ XXX / ReactNativeProjects / react_native_prototype / node_modules \ n \ n这   可能与...有关   https://github.com/facebook/react-native/issues/4968 \ n要解决尝试   以下内容：\ n


清除守望者手表：watchman watch-del-all。\ n

删除node_modules文件夹：rm -rf node_modules && npm install。\ n

重置打包程序缓存：rm -fr $TMPDIR/react-*或npm start -- --reset-cache

我完成了所有步骤，但在Android和/或iOS模拟器中运行应用程序时仍然收到相同的错误消息。

然后我查看了/Users/xxx/ReactNativeProjects/react_native_prototype/node_modules/react-click-outside/dist/index.js文件，发现该库从react-dom导入了一些内容。但我认为react-native不使用任何DOM？是对的吗？因此，反应点击外部似乎只与react-js兼容，但与react-native不兼容。我对吗？或者有没有人可能找到一个简单的解决方案来模拟handleClickOutside()行为？

我的代码如下所示：

import React from 'react';
(...)
import clickOutside from 'react-click-outside';

const newClass = class TrafficNodeFinder extends React.Component {

    (...)    
    handleClickOutside() {
        this.setState({
            listOfNodes: ds.cloneWithRows([])
        });
    }

    (...) 


}

export default clickOutside(newClass);

我现在得到的错误如下：

找不到变量：document

WrappedTrafficNodeFinder_componentDidMount       index.js：17

      ReactCompositeComponent.js：353

measureLifeCyclePerf       ReactCompositeComponent.js：85

      ReactCompositeComponent.js：352

notifyAll的       CallbackQueue.js：73

接近       ReactNativeReconcileTransaction.js：36

CLOSEALL       Transaction.js：222

执行       Transaction.js：163

batchedMountComponentIntoNode       ReactNativeMount.js：77

执行       Transaction.js：149

batchedUpdates       ReactDefaultBatchingStrategy.js：65

batchedUpdates       ReactUpdates.js：111

renderComponent       ReactNativeMount.js：141

渲染       ReactNative.js：31

renderApplication       renderApplication.js：33

运行       AppRegistry.js：76

runApplication       AppRegistry.js：105

__ callFunction       MessageQueue.js：236

      MessageQueue.js：108

护卫       MessageQueue.js：46

callFunctionReturnFlushedQueue       MessageQueue.js：107

我只是试图模拟反应点击外部的行为。我想已经包围了组件，该组件将使用View-Elements对其外部的点击作出反应。但似乎Views和其他react-native UI组件没有任何单击处理程序。当我使用TouchableHighlight环绕我的视图时，只有在我填充填充时才可以单击。否则所有子组件“消耗”父母的点击事件。也许我可以以某种方式告诉我的视图层次结构中的孩子将点击事件传递给父母？

Answer 1

不，react-click-outside依赖于document.addEventListener，但React Native中没有文档，因为没有底层DOM。

反应原生支持反应点击外部吗？

1 个答案: