如何在“樣式”屬性中引用 javascript 變量？

Question

我正在使用 Vue 和 GraphQL 根據數據庫中的行生成一個div網格。 每行/ div都有一個background_color列。 我希望用戶能夠使用 div 內的表單分別更改每個div的background_color 。

我已經驗證我的 forms 正確更新了相應的background_color列，但是當我嘗試將該值應用於 div 時，沒有任何反應：

<div v-for="row in graphQL_result.table" class="grid">
     <div class="box" style="background:row.background_color">

如果我無法以我的風格引用數據庫值，我應該如何處理呢？

Answer 1

嘗試樣式綁定：

<div class="box" :style="{'background' : row.background_color}"></div>

欲了解更多信息