Question

我尝试使用React Native Windows为UWP Apps使用模态组件，但我收到了如下警告。

警告：＆＃34; RTCModalHostView＆＃34;的本机组件不存在。

如何使用React Native Windows的UWP应用程序使用模态组件？

Answer 1

官方模态组件暂时不可用，您可以从以下位置查看可用的组件：

https://github.com/Microsoft/react-native-windows/blob/master/docs/CoreParityStatus.md

创建模态的临时解决方案是使用自定义组件

import React, { Component } from 'react'
import { View } from 'react-native'
import Styles from './Styles/ModalStyles'

export default class Modal extends Component {
  static propTypes = {
    visible: React.PropTypes.bool,
    children: React.PropTypes.object
  }

  render () {
    if (!this.props.visible) return (<View />)

    return (
      <View style={Styles.modal}>
        {this.props.children}
      </View>
    )
  }
}

样式示例：

import { StyleSheet } from 'react-native'

export default StyleSheet.create({
  modal: {
    position: 'absolute',
    top: 0,
    right: 0,
    bottom: 0,
    left: 0,
    backgroundColor: 'rgba(0,0,0,0.5)',
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  }
})

这是完整的参考：https://github.com/Microsoft/react-native-windows/issues/618

React Native Windows UWP - 是否可以使用模态组件？

1 个答案: