React-native: 从状态动态加载图像

创建于 2015-10-30  ·  3评论  ·  资料来源: facebook/react-native

大家好,

我有一个问题,我尝试通过状态对象的更改来更改图像源,但它没有改变。
我已经记录了该值并且它正在更改,但图像没有。

这是我使用的代码:

render() {
        var images = {
            playcircle: require('image!playcircle'),
            pausecircle: require('image!pausecircle')
        }
        return (
            <View style={[styles.container, {width: this.props.width - 10}]}>
                <TouchableOpacity onPress={this._playAudio.bind(this)}>
                    <Image source={images[this.state.playImage]} style={styles.img} />
                </TouchableOpacity>
                <View style={styles.textWrapper}>
                    <Text style={styles.txt}>{this.props.podTitle}</Text>
                </View>
            </View>
        );
    }
_playAudio() {
        var blockThis = this;
        debugger;
        if (!this.state.isPlaying) {
            JSAudioPlayer.play(this.props.url, true, function(error){
                if (error) {
                    alert(error);
                } else {
                    blockThis.setState({
                        isPlaying: true,
                        playImage: 'pausecircle'
                    })
                }
            });
        } else {
            JSAudioPlayer.pauseCurrent();
            blockThis.setState({
                isPlaying: false,
                playImage: 'playcircle'
            });
        }       
    }

任何帮助将不胜感激。
提前致谢

@josev55

Ran Commands Locked

最有用的评论

前段时间我有类似的东西。 尝试将 key 属性添加到图像标签中,例如<Image key={images[this.state.playImage].uri} ... /> 。 在这种情况下,这对我有用 https://github.com/facebook/react-native/issues/3471

所有3条评论

前段时间我有类似的东西。 尝试将 key 属性添加到图像标签中,例如<Image key={images[this.state.playImage].uri} ... /> 。 在这种情况下,这对我有用 https://github.com/facebook/react-native/issues/3471

@facebook-github-bot 堆栈溢出

@josev55 ,感谢您发布此消息! @cosmith告诉我这个问题看起来像是一个最好在StackOverflow上提出的问题。 StackOverflow 的问答功能令人惊叹:它有信誉系统、投票、将问题标记为已回答的能力。 由于声誉系统,社区很可能会在那里看到并回答您的问题。 这也有助于我们将 GitHub 错误跟踪器仅用于错误。 将关闭它,因为这确实是一个应该在 SO 上提出的问题。

此页面是否有帮助?
0 / 5 - 0 等级