我设置了一个标志foundInBrowser
,它通知我条目'aaa'
是否存在于localStorage中。单击input toggle添加/删除条目,这反过来会自动更新标志:
<template>
<q-toggle
v-model="foundInBrowser"
checked-icon="check"
color="red"
:label="`${foundInBrowser ? '' : 'not'} registered in browser`"
unchecked-icon="clear"
@click="registerInBrowser"
/>
</template>
<script>
const registerInBrowser = () => {
// toggle the existance of the localstorage entry
if (foundInBrowser.value) {
localStorage.removeItem('aaa')
} else {
localStorage.setItem('aaa', person.value?.ID as string)
}
}
const foundInBrowser = computed(() => localStorage.getItem('aaa') !== null)
</script>
字符串
当点击切换时,我在控制台中得到一个错误:
Write operation failed: computed value is readonly
型
我不明白这个错误:我不想在任何地方写foundInBrowser
。
1条答案
按热度按时间cbjzeqam1#
基本上就是它说的那样。你将一个computed放入
v-model
:字符串
由于
v-model
是双向绑定,所以q-toggle将写回它,这会失败,并返回错误,因为您无法写入常规计算。要么通过只绑定到
modelValue
将其转换为单向绑定:型
或者将你的computed转换为可写的computed:
型