React-native 中image 组件的简单封住,uri的问题

#1
  render () {
    const _uri = this.props.url
    return (
    <View>
      <Text>
        {this.props.url}
      </Text>
      <Image 
        style={[styles.normal,  this.props.style]}
        source = {require('../screens/img.jpg')}
      />
      <Image 
        style={[styles.normal,  this.props.style]}
        source = {require(_uri)}
      />
    </View>
    )
  }

require(uri)会不通过,请问怎么解决

#2

很好!!!!

#3

报什么错,如果你引用的是本地图片用require,如果是线上的图片的话应该这样写:source={{uri:“http://baodu.com”}}

#4

本地资源,但是我的资源路径是通过组件的props传递进来的,不是直接写死的.。考虑到资源路劲的可配置性

#5

const _uri = this.props.url; source = {require(_uri)}就像这样的形式

#6

require不支持动态加载资源,好吧,懂了

#7

嗯嗯,懂了就好之前我也是弄了好久才明白

1 Like
#8

我是,只要不是直接引用本地资源,我就都用{{uri:""}}

1 Like
#9

这是因为初始化时,url不存在。
简单解决就是:直接赋值(不用require),最好img给出alt

其次就是react官方说明,React组件:在render()里使用props和state来创建它.基于props的重复数据:尽可能保持用props来做作为唯一的数据来源.把props保存到state中的有效的场景是需要知道它以前的值得时候,因为未来的props可能会变化.你在render声明const _uri 不合适

#10

那应该在在哪里声明?