我有以下代碼：
<template>
<div style="min-height: 320px;>
<q-select style="min-width: 92px;" outlined :options="options" label="Número de parcelas" emit-value map-options v-model="installments"></q-select>
</div>
</template>
<script>
import { useQuasar } from 'quasar'
import { useStore } from 'vuex'
import { defineComponent, ref, computed } from 'vue'
export default defineComponent({
name: 'PageIndex',
components: {
loading
},
setup () {
const store = useStore()
const $q = useQuasar()
let installments = ref(12)
const product = computed(() => {
return store.getters['checkout/getCheckoutProduct']
})
let options = ref([
{
label: `12x de R$ ${(product.value.price / 12)}`,
value: 12
},
{
label: `11x de R$ ${(product.value.price / 11)}`,
value: 11
}
])
return {
product,
options,
installments
}
}
})
</script>
問題是回傳 UNDEFINED，甚至 product.value.price 正確顯示在我的 vuex 中的 VUE devtools 中。此外，組件上的其他地方正在獲取產品價值，但是......“選項”不起作用。
請注意，選項內部有變數，我如何將變數從計算傳遞給 ref() 變數？！
uj5u.com熱心網友回復：
Ref 只會被呼叫一次。它用于設定，因此它的作業方式類似于 onCreated 鉤子。您應該使用過計算屬性。它計算反應性內容。
檢查我的演示：
https://codesandbox.io/s/vue-3-vuex-4-vue-router-forked-4u0lj?file=/src/views/Home.vue
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/354909.html
標籤：Vue.js Vuex Vuejs3 类星体框架 vue-composition-api
下一篇：VueJs影像未顯示