我有一個(gè)如下所示的輸入字段：<tr v-for="(item, index) in collection"> ... <input type="checkbox" v-model="item.activated" @change="toggleSwitch(item.resource_url, 'activated', item)"> > ...</tr>這collection是一個(gè)包含多個(gè)鍵的數(shù)組，activated 是其中之一。activated等于1或0當(dāng)數(shù)據(jù)來(lái)自 mysql 數(shù)據(jù)庫(kù)時(shí)。問(wèn)題在于，在這種情況下，輸入字段始終設(shè)置為 true，即使activated等于 1 或 0?，F(xiàn)在，我嘗試像這樣編寫(xiě) v-model 來(lái)解決這個(gè)問(wèn)題：v-model="!!+item.activated"通過(guò)添加，!!+我會(huì)將整數(shù)值轉(zhuǎn)換為布爾值并使用它。這解決了問(wèn)題，但又產(chǎn)生了另一個(gè)問(wèn)題。我這樣做遇到的另一個(gè)問(wèn)題是，當(dāng)我嘗試更改檢查的輸入時(shí)，出現(xiàn)錯(cuò)誤：[Vue warn]: Cannot set reactive property on undefined, null, or primitive value: falseadmin.js:120238 TypeError: Cannot use 'in' operator to search for 'activated' in false該toggleSwitch方法如下所示：toggleSwitch: function toggleSwitch(url, col, row) { var _this8 = this; axios.post(url, row).then(function (response) { _this8.$notify({ type: 'success' }); }, function (error) { row[col] = !row[col]; _this8.$notify({ type: 'error' }); });},我是 Vue.js 新手，知道如何調(diào)試它以及我的問(wèn)題來(lái)自哪里？我很樂(lè)意提供任何其他信息。
2 回答
浮云間
TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超4個(gè)贊
如果您使用 AJAX 來(lái)填充collection，那么您應(yīng)該在 AJAX 回調(diào)中將0和1字符串轉(zhuǎn)換為布爾值，然后再將它們注入到組件中?；蛘吒玫氖牵梢灾苯訌目刂破鬓D(zhuǎn)換它們，順便說(shuō)一下，您可以直接獲取true|false
data.forEach(function(entry) {
if(entry.hasOwnProperty("activated"))
entry.activated = !!+entry.activated
});
慕無(wú)忌1623718
TA貢獻(xiàn)1744條經(jīng)驗(yàn) 獲得超4個(gè)贊
我的建議是：
數(shù)據(jù)庫(kù)列“已激活”tinyint(1)
在 Laravel 模型中使用 $cast 數(shù)組將“activated”轉(zhuǎn)換為“boolean”
在 vue 中，使用原生類(lèi)型 boolean 作為 form.activated 的 true 和 false
拉拉維爾模型：
protected $casts = [
'created_at' => 'datetime',
'updated_at' => 'datetime',
'minimum' => 'float',
'maximum' => 'float',
'step' => 'float',
'minItems' => 'integer',
'maxItems' => 'integer',
'uniqueItems' => 'boolean',
];
看法：
<b-form-radio-group id="uniqueItems" v-model="formData.uniqueItems" :options="optionsBoolean" name="uniqueItems" :/>
optionsBoolean (){
return [
{ text: 'Yes'), value: true },
{ text: 'No'), value: false }
]
}
- 2 回答
- 0 關(guān)注
- 155 瀏覽
添加回答
舉報(bào)
0/150
提交
取消