javascript VUEJS中的locaStorage复选框值-尝试格式化正在存储的值

vwkv1x7d  于 2022-12-28  发布在  Java
关注(0)|答案(1)|浏览(86)

我正在将复选框值ID保存到localStorage,并希望使用此值从与此ID匹配的子数据库中检索数据。复选框值正在保存到localStorage,但按如下方式填充。

什么是最好的方式来格式化它,以便我可以匹配的ID时,我提取数据与supabase,如果是这样,如何?模板代码如下。

<div class="flex items-center h-5 absolute z-10 translate-x-3 translate-y-4">
  <input v-model="selected" :value="listings.id" type="checkbox" class="text-[#FF385C] focus:border-transparent focus:ring-0 bg-black bg-opacity-50 outline-none focus:outline-none h-5 w-5 border border-white rounded-full p-2">
  </div>

脚本代码如下

<script setup>
const selected = ref([]) 
const Local1 = localStorage.getItem('comparable')

watch(selected, newVal => {
localStorage.setItem('comparable', JSON.stringify(newVal)) 
}, {deep: true})
</script>

然后,我检索的ID在另一个组件与下面。并希望使用ID的获取匹配的数据从Supabase。

const Local1 = localStorage.getItem('comparable')

const fetchData = async () => {
const { data, } = await supabase
.from("airbnb")
.select()
.eq('id', *ID number/s to be passed here* )
Filteredlist1.value = data;
 };
ffscu2ro

ffscu2ro1#

all good - i通过使用其他组件中的const Local1 = JSON.parse(localStorage.getItem('comparable'))正确检索了列表,并使用下面的supabase函数检索了数据。

const fetchData = async () => {
const { data, } = await supabase
.from("airbnb")
.select()
.in('id', [ Local1 ] )
 Filteredlist1.value = data;
 };

相关问题