React-Native-Image 没有播放完整的 gif答案

【问题标题】：React-Native-Image not playing full gifReact-Native-Image 没有播放完整的 gif
【发布时间】：2018-01-12 19:39:31
【问题描述】：

我这里有一个 gif：

我在这里有我的index.ios.js：

return (
      <View style={styles.container}>
        <Image
          style={{width: 200, height: 400}}
          source={{uri: this.state.path}} />
      </View>

但是输出是这样的：

关于如何让它播放整个 gif 的任何想法？

【问题讨论】：

标签： ios react-native gif

【解决方案1】：

您的输出 gif 将打开 Safari 而不是 iOS 应用程序。您可以在尝试打开应用程序时发布输出 gif 吗？

您可能还想确认您用作gif 来源的this.state.path 的值。

它需要有扩展名.gif 才能工作。例如

<Image source={{uri: 'http://www.urltogif/image.gif'}} /> 

//or

<Image source={require('./path/to/image/local.gif')} />

你可以在这里找到一个工作示例https://snack.expo.io/ByglJIzD-

【讨论】：

这是动图。 Safari 开放是 gif 的一部分 :) 这是原始 gif 路径：user-images.githubusercontent.com/13806068/…
snack.expo.io/BkIPe8Mvb 更新了示例，它加载并运行了整个 gif
这确实有效......我想知道为什么它对我不起作用，我将在我自己的项目中更多地使用它。感谢您的帮助！
我想通了！我认为它有问题的原因是因为我会在渲染中运行的函数中重新设置状态，所以每次重新设置状态时都会重新加载图像
好的，你不应该在渲染方法中重置状态。可能使用 eventHandlers(onPress 等) 或 componentWillReceiveProps 来处理你想做的任何状态突变:)

【解决方案2】：

为我工作，使用 React Native 0.47.1 的全新项目。

渲染函数如下所示：

render() {
    return (
      <View style={styles.container}>
        <Image style={{width: 200, height: 400}} 
               source={{uri: 'https://user-images.githubusercontent.com/13806068/28982817-ffd1fdc2-790b-11e7-9bc2-a2d1135ca232.gif'}}/>
      </View>
    );
  }

【讨论】：