Portal2版

import React, { Component } from "react";
import { Text, View, Button, Dimensions } from "react-native";
const ThemeContext = React.createContext({
  add: () => {}
});
class Portal extends Component {
  render() {
    return (
      
        {({add}) => {
          setTimeout(()=>{
            add(this.props.children)
          },0)  
        }}
      
    );
  }
}
let triggerChange = () => {}
class Layer extends Component {
  state = {
    node: null,
    nub: 0
  }
  componentWillMount() {
    triggerChange = (node) => {
      this.setState({
        node
      })
    }
  }
  render() {
    return (
      {this.state.node}
    )
  }
}
class App extends Component {
  state = {
    node: null,
    nub: 0
  }
  add = (node) => {
    triggerChange(node)
  }
  addNub = () => {
    this.setState({
      nub: this.state.nub+1
    })
  }
  render() {
    return (
      
        
          本来该出现的位置
          
            {this.state.nub}
            
              蒙层
            
            
          
        
        
      
    );
  }
}

export default App;

你可能感兴趣的:(Portal2版)