标签: react-native-ios

如何检测当前是否按下了 Shift 键？我有一个文本输入，当用户按下 Enter 键时，如果他们当前没有按下 Enter 键，我只想提交表单（与桌面上的 Facebook Messenger 的表单功能相同）。

这是我的文本输入：

<TextInput
    style={styles.input}
    placeholder={'Enter message'}
    onKeyPress={this.handleKeyPress}
/>

这是处理程序：

handleMessageInputKeyPress(e) {
    if(e.nativeEvent.key == "Enter"){
        // Now check if the SHIFT key is currently pressed or not...
    }
}

您知道如何在本机上限制 iOS 上可访问性附带的 fontSize 乘数吗？我看到了这个要点：https : //gist.github.com/Jpoliachik/ed5cb38b480bc544427ce0db529786bf
但它似乎过时了，我在 Obj-C 中还不够好，无法修复它。

我想添加last seen at today 1pm用户上次访问或打开我的应用程序的时间 - WhatsApp 和其他聊天应用程序等具有的功能。

在我的 React Native 聊天应用程序中，我使用 redux 进行状态处理。我在后端使用 Firebase。我的聊天应用程序快完成了，但我不知道如何添加用户上次看到的功能。

我正在测试嵌套在导航器中的 FlatList 并试图了解它是如何工作的。下面的代码工作正常：

<FlatList
    data={[{key: 'a'}, {key: 'b'}]}
    renderItem={({item}) => <Text>{item.key}</Text>}
    horizontal={true}
/>

但这不会：

<FlatList
    data={[{key: 'a'}, {key: 'b'}]}
    renderItem={({item}) => <TextComp data={item}/>}
    horizontal={true}
/>

TextComp 只是一个显示 item.key 的组件，并且在单独测试时按预期工作。代码是

<View> 
    <Text>{this.props.data.key}</Text> 
</View> 

我还尝试在两个组件周围绘制边框，似乎 FlatList 肯定正在呈现，但项目不是。

我正在我的 Android 设备上进行测试。

更新：我向 TextComp 组件添加了 console.log(this.props) 语句，它正确显示了道具，因此正确的数据正在从 FlatList 传递到 TextComp，但 TextComp 没有被呈现。

我需要在我的本机应用程序中播放 Vimeo 视频。我正在使用 webview 播放视频，视频播放但我在屏幕上看不到任何内容，音频即将到来但屏幕是空白的。下面是我的代码。是我做错了什么还是有其他方式可以玩 Vimeo？任何帮助，将不胜感激。

<AutoHeightWebView
    startInLoadingState
    style={{ width: "100%", height: '100%', borderColor: 'white', borderWidth: 2 }}
    source={{
        uri: 'https://player.vimeo.com/video/299264098?autoplay=1' //'this.state.videoUrl'
    }}
    onError={() => console.log('on error')}
    onLoad={() => console.log('on load')}
    onLoadStart={() => console.log('on load start')}
    onLoadEnd={() => console.log('on load end')}

    bounces={false}
/>

我正在尝试提供在给定 Base64 字符串的情况下下载 PDF 的能力。我可以使用“react-native-view-pdf”查看PDF。只是无法弄清楚如何实际下载文件。这将需要适用于 android 和 ios。

我已经尝试了各种论坛，但遗憾的是却无处可去。

注意：this.props.pdf 是 Base64 字符串。

尝试 1)

var path = RNFetchBlob.fs.dirs.DocumentDir + "/bill.pdf";
RNFetchBlob.fs.writeFile(path, this.props.pdf, "base64").then(res => {
  console.log("File : ", res);
});

尝试 2)

RNFetchBlob.config({
  fileCache : true,
  appendExt : 'pdf'
})
.fetch('GET',`${this.props.PDFLink}`)
.then((res) => {
  // open the document directly
  if(Platform.OS == "ios"){
  RNFetchBlob.ios.previewDocument(res.path())
  }
  else{
    RNFetchBlob
    .config({
        addAndroidDownloads : {
            useDownloadManager : true, // <-- this is the only thing required
            // Optional, override notification setting (default to true) …

我正在运行 react-native APP 并尝试运行 ios 部分。启动成功，但黑屏。我也看不到 Launcher 上的任何选项。请看下图。

见模拟器

同样，它是 React Native，我想在 ios 模拟器上运行

我已经安装react-native-fetch-blob在 react-native 上version 0.60.5。当我运行时pod install，错误出现在你可以看到的

请指导我如何解决这个问题

async postFileUpload(payload) {
    const rnfetchfile = RNFetchBlob.wrap(payload.uri);
    try {
    console.log(
        'POST',
        'https://******.***.**/******/***/upload_*******_file',
        {
          ...this.config,
          'Content-Type': 'multipart/form-data',
        },
        [
          // element with property `filename` will be transformed into `file` in form data
          {
            name: 'files',
            filename: payload.name,
            data: rnfetchfile.replace('file://file:///', 'file://'),
          },
        ],
      );
      const res = await RNFetchBlob.fetch(
        'POST',
        'https://******.***.**/******/***/upload_*******_file',
        {
          ...this.config,
          'Content-Type': 'multipart/form-data',
        },
        [
          // element with property `filename` will be transformed into `file` in form data
          {
            name: 'files',
            filename: payload.name,
            data: rnfetchfile.replace('file://file:///', 'file://'),
          },
        ],
      );
    const …

我在 iOS 上收到以下错误作为可消除的错误。（按 esc 按钮隐藏错误并显示我的应用程序。）

无效的 YGDirection 'row' 应该是以下之一：(inherit, ltr, rtl) - React Native

我在我的项目中使用样式组件，但我认为这个错误不是由组件引起的。

由于 react-native 使用 flex 布局，我们应该能够使用该flex-direction属性。

我的包装组件如下：

const Wrapper = styled.View`
  flex: 1;
  align-items: ${props => props.align};
  justify-content: ${props => props.justify};
  flex-direction: ${props => props.direction};
  flex-grow: ${props => props.grow};
  flex-shrink: ${props => props.shrink};
`;

Wrapper.defaultProps = {
  direction: 'column',
  align: 'flex-start',
  justify: 'flex-start',
  grow: 1,
  shrink: 0,
};

我错过了什么吗？完整的错误如下所示：