有没有办法可以使用uri而不是React Native Prop类型的要求？

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不仅仅是一个可以传递给Image源头的字符串。它需要是一个具有uri字符串prop的对象，如下所示：

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

其次，使用prop类型，您只需定义要在调试时使用哪些道具验证。它与您的图像无法显示无关。如果您发错了道具，它会显示黄色警告屏幕。

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

因此，在没有看到其余代码的情况下，您可以更好地更改此部分：

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