使用样式在 React.js 中设置背景

Question

我想通过使用样式定义在 React.js 中添加背景图像，它有效：

 let imgUrl = 'images/berlin.jpg'
let styles = {
        root: {
            backgroundImage: 'url(' + imgUrl + ')',
            overflow: 'hidden',
        },
        ...

如您所见，图像在 x 方向重复。所以我想通过以下方式扩展它：

 let imgUrl = 'images/berlin.jpg'
let styles = {
    root: {
        backgroundImage: 'url(' + imgUrl + ')',
        backgroundImage: {
            flex: 1,
            resizeMode: 'cover', // or 'stretch'
        },
        overflow: 'hidden',
    },
    ...

但是图像不再加载：

那么在React.js中如何设置和调整背景图片呢？

原文由 Marcel 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这有效：

     let imgUrl = 'images/berlin.jpg'
    let styles = {
        root: {
            backgroundImage: 'url(' + imgUrl + ')',
            backgroundSize: 'cover',
            overflow: 'hidden',
        },
        ...

原文由 Marcel 发布，翻译遵循 CC BY-SA 3.0 许可协议