哪一個最適合在 React 中使用，為什么？
*注意：示例在 React jsx 語法中；
<div style={ condition ? {backgroundColor:'#d6f9dd'} : {} }>
<div style={ condition ? {backgroundColor:'#d6f9dd'} : undefined }>
<div style={ condition ? {backgroundColor:'#d6f9dd'} : null }>
<div style={ condition ? {backgroundColor:'#d6f9dd'} : 'inherit' }>
<div style={ condition ? {backgroundColor:'#d6f9dd'} : 'none' }>
uj5u.com熱心網友回復：
就個人而言，我只在需要覆寫由單獨庫附加的 css 屬性時才使用 style 屬性。
在您提供的選項中，唯一有效的選項如下：
<div style={ condition ? {backgroundColor:'#d6f9dd'} : {} } />
<div style={ condition ? {backgroundColor:'#d6f9dd'} : undefined } />
React 期望 style 屬性要么是未定義的，要么是一個物件。
最重要的是，我將有條件地應用 css 屬性本身而不是整個樣式物件。
像這樣：
<div style={{ backgroundColor: condition ? '#d6f9dd' : undefined }} />
這樣，如果我需要應用多個樣式屬性，但其中一個取決于條件，即使條件不成立，仍然可以應用另一個。將屬性設定為 undefined 類似于根本沒有將其包含在樣式物件中。
uj5u.com熱心網友回復：
不要使用空物件。它們可以回傳真實值，也可以回傳屬性。
console.log(typeof {}.hasOwnProperty); // function
這可能會導致問題。如果想要行內樣式imo，最好的選擇是使用 undefined
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/350009.html
標籤：javascript 反应 内联样式