[ReactNative] JS files for D1947217
This commit is contained in:
Родитель
c430782e81
Коммит
bf4bd4b08e
|
@ -0,0 +1,70 @@
|
||||||
|
/**
|
||||||
|
* Copyright 2004-present Facebook. All Rights Reserved.
|
||||||
|
*
|
||||||
|
* @providesModule Portal
|
||||||
|
* @flow
|
||||||
|
*/
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var React = require('React');
|
||||||
|
var StyleSheet = require('StyleSheet');
|
||||||
|
var View = require('View');
|
||||||
|
|
||||||
|
var _portalRef: any;
|
||||||
|
|
||||||
|
/*
|
||||||
|
* A container that renders all the modals on top of everything else in the application.
|
||||||
|
*
|
||||||
|
* Portal makes it possible for application code to pass modal views all the way up to
|
||||||
|
* the root element created in `renderApplication`.
|
||||||
|
*
|
||||||
|
* Never use `<Portal>` in your code. There is only one Portal instance rendered
|
||||||
|
* by the top-level `renderApplication`.
|
||||||
|
*/
|
||||||
|
var Portal = React.createClass({
|
||||||
|
statics: {
|
||||||
|
showModal: function(component) {
|
||||||
|
if (!_portalRef) {
|
||||||
|
console.error('Calling showModal but no Portal has been rendered');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
_portalRef.setState({modal: component});
|
||||||
|
},
|
||||||
|
|
||||||
|
closeModal: function() {
|
||||||
|
if (!_portalRef) {
|
||||||
|
console.error('Calling closeModal but no Portal has been rendered');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
_portalRef.setState({modal: null});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
getInitialState: function() {
|
||||||
|
return {modal: (null: any)};
|
||||||
|
},
|
||||||
|
|
||||||
|
render: function() {
|
||||||
|
_portalRef = this;
|
||||||
|
if (!this.state.modal) {
|
||||||
|
return <View />;
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<View style={styles.modalsContainer}>
|
||||||
|
{this.state.modal}
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var styles = StyleSheet.create({
|
||||||
|
modalsContainer: {
|
||||||
|
position: 'absolute',
|
||||||
|
left: 0,
|
||||||
|
top: 0,
|
||||||
|
right: 0,
|
||||||
|
bottom: 0,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
module.exports = Portal;
|
|
@ -11,7 +11,10 @@
|
||||||
*/
|
*/
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
var Portal = require('Portal');
|
||||||
var React = require('React');
|
var React = require('React');
|
||||||
|
var StyleSheet = require('StyleSheet');
|
||||||
|
var View = require('View');
|
||||||
|
|
||||||
var invariant = require('invariant');
|
var invariant = require('invariant');
|
||||||
|
|
||||||
|
@ -25,11 +28,26 @@ function renderApplication<D, P, S>(
|
||||||
'Expect to have a valid rootTag, instead got ', rootTag
|
'Expect to have a valid rootTag, instead got ', rootTag
|
||||||
);
|
);
|
||||||
React.render(
|
React.render(
|
||||||
|
<View style={styles.appContainer}>
|
||||||
<RootComponent
|
<RootComponent
|
||||||
{...initialProps}
|
{...initialProps}
|
||||||
/>,
|
/>
|
||||||
|
<Portal />
|
||||||
|
</View>,
|
||||||
rootTag
|
rootTag
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var styles = StyleSheet.create({
|
||||||
|
// This is needed so the application covers the whole screen
|
||||||
|
// and therefore the contents of the Portal are not clipped.
|
||||||
|
appContainer: {
|
||||||
|
position: 'absolute',
|
||||||
|
left: 0,
|
||||||
|
top: 0,
|
||||||
|
right: 0,
|
||||||
|
bottom: 0,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
module.exports = renderApplication;
|
module.exports = renderApplication;
|
||||||
|
|
Загрузка…
Ссылка в новой задаче