Backgroundimage在反應中不起作用

我是新來做出反應並嘗試使用內聯樣式獲取背景圖像。但它不起作用。Backgroundimage在反應中不起作用

顯示錯誤「網址沒有定義」

render() { 
    return (
     <div className="phase1" 
      style ={ { backgroundImage: url('https://lh3.googleusercontent.com/MOf9Kxxkj7GvyZlTZOnUzuYv0JAweEhlxJX6gslQvbvlhLK5_bSTK6duxY2xfbBsj43H=w300') } }> 

      <input id="search" 
        type="text" 
        placeholder={this.state.search} 
        onChange={this.updateSearch.bind(this)}/> 
      &nbsp; &nbsp;&nbsp; &nbsp; 

      <Link className="button1" to="Form"> + </Link> 
     </div> 
     ) 
    } 
}

來源

2016-08-05 komal deep singh chahal

包它在引號中，當你在JSX中添加curlies時，你在JS上下文中，所以你實際上試圖調用一個名爲'url'的函數，它不存在 – ZekeDroid

你可以通過做什麼來顯示 –

CSS值始終爲字符串。裹在引號中backgroundImage價值，使之成爲字符串：

<div className="phase1" style ={ { backgroundImage: "url('https://lh3.googleusercontent.com/MOf9Kxxkj7GvyZlTZOnUzuYv0JAweEhlxJX6gslQvbvlhLK5_bSTK6duxY2xfbBsj43H=w300')" } }>

來源

2016-08-05 16:55:50

面臨着類似的問題，這並獲得成功，我

style={{backgroundImage: 'url(' + require('./images/sword.png') + ')'}}

的伎倆被添加require

來源

2017-11-11 12:35:34 Kraulain

Backgroundimage在反應中不起作用

回答

相關問題