有没有一种方法可以使用URI而不是对本机道具类型的需要

Question

当我尝试使用 uri时，图像不会显示，我想避免本地图像，因为我无法动态使用 require。

static propTypes = {
    ...ViewPropTypes,
    initialPage: PropTypes.number,
    pager: PropTypes.instanceOf(IndicatorViewPager),
    tabs: PropTypes.arrayOf(PropTypes.shape({
        text: PropTypes.string,
        iconSource: Image.propTypes.source, <-- Here is the problem
        selectedIconSource: Image.propTypes.source
    })).isRequired,
}

有什么方法可以使此接受URI来源？这也是我的其余代码：

let tabs = [{
    text: `${this.state.tags.toLowerCase()}`,
    iconSource: 'https://www.exmaple.com/img/cookies.png',
    selectedIconSource: require("../img/bluep.png")
}];

Answer 1

我认为您正在混合几件事。图像源可以是require（）或URI，但URI不仅是字符串，还可以传递给图像的源道具。它需要是一个具有URI字符串道具的对象，例如：

<Image source={{uri: 'http://myimageurl.com'}}/>

第二，使用Prop类型，您只是定义要在调试时间使用的Prop验证。它与您的图像无关。如果您发送了错误的道具，它将向您显示一个黄色的警告屏幕。

最后，您的问题是您只是将道具作为字符串发送，并且需要发送对象。

所以，没有看到代码的其余部分，您应该可以更改此部分：

let tabs = [{
    text: `${this.state.tags.toLowerCase()}`,
    iconSource: {uri: 'https://www.exmaple.com/img/cookies.png'},
    selectedIconSource: require("../img/bluep.png")
}];