2017-10-04 4 views
0

React Native Windowsを使用してUWP Appsのモーダルコンポーネントを使用しようとしましたが、以下のような警告が表示されます。ネイティブWindows UWPに対応 - モーダルコンポーネントを使用できますか?

警告: "RTCModalHostView"のネイティブコンポーネントは存在しません。

React Native WindowsのUWP Appsのモーダルコンポーネントを使用するにはどうすればよいですか?モーダルを作成する

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> 
    ) 
    } 
} 

を使用している:あなたがから利用可能なコンポーネントを確認することができます

+0

はカスタムコンポーネントですか?あなたのプロジェクトやライブラリからコンポーネントをインポートするのを忘れたようです。 –

+0

いいえ、それはカスタムコンポーネントではありません。 https://facebook.github.io/react-native/docs/modal.html – sohda

+0

私はこのようなコンポーネントをインポートしました: 'react-native'から 'import {Modal、Text、TouchableHighlight、View}; – sohda

答えて

1

は公式モーダル・コンポーネントは、今では使用できませんスタイル例:

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

+0

ありがとう、どうぞお試しください。 – sohda

関連する問題