ReactDOM和document.body在React Native中的等效变量是什么? (Expo)
问题描述:
我正在构建一个Modal
组件,基于此组件,我在网络上使用了ReactJS。我将Modal
作为孩子附加到document.body
,并根据需要安装/卸载。ReactDOM和document.body在React Native中的等效变量是什么? (Expo)
我的问题是没有ReactDOM或document.body的在本地做出反应。这里是我的modal.py
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { store } from '../store';
import { Provider } from 'react-redux';
class Modal extends Component {
comoponentDidMount() {
this.modalTarget = document.createElement('div');
this.modalTarget.className = 'modal';
document.body.appendChild(this.modalTarget);
this._render();
}
_render() {
ReactDOM.render(
<Provider store={store}>
<div>{this.props.children}</div>
</Provider>,
this.modalTarget
);
}
componentWillUpdate() {
this._render();
}
componentWillUnmount() {
ReactDOM.unmountComponentAtNode(this.modalTarget);
document.body.removeChild(this.modalTarget);
}
render() {
return <noscript />;
}
}
我使用世博会和它的加载App.js默认!并没有document.body和ReactDOM。我怎么解决这个问题?
答
我们在反应本机中没有任何DOM。您应该创建一个模块组件并将其导入您想要使用的其他组件。你的模态的位置必须是绝对的,并且为了显示模态,你可以传递一个道具给它。
您可以使用原生的反应模式: https://facebook.github.io/react-native/docs/modal.html 或个人喜欢这个创建的任何其他情态动词: https://github.com/maxs15/react-native-modalbox
我不想模态得到定位从屏幕CSS。我必须处理z-index才能弹出模态。我的方法是让身体的小孩解决CSS问题。此外,组件上的伪造模态调用附着在身体上的模态。 –
感谢您的回答。感谢您将时间放在我的问题上 –