Apabila saya mempunyai harta yang dipanggil wildcardItem
的计算属性,该属性在使用开发构建时有效,但当我运行生产构建 (mix --product
) harta itu tidak lagi dikemas kini.
Saya menggunakan Laravel Mix untuk menyusun kod.
mix.setPublicPath('../') .js('js/app.js', 'dist/app.js') .vue() .postCss('css/app.css', 'dist/app.css', [ require('postcss-import'), require('@tailwindcss/nesting'), require('tailwindcss'), require('autoprefixer'), ]) .options({ manifest: false, });
const items = ref([]); const query = ref(''); const wildcardItem = computed(_ => { console.log('Computing wildcard...'); return { label: query.value, }; }); document.addEventListener('CustomEvent', function (event) { items.value = [ ...event.detail.items, wildcardItem, ]; });
<template> <div> <input v-model="query" /> <div v-for="(item, index) in items" :key="`item-${index}`"> {{ item.label }} </div> </div> </template>
Saya juga tidak dapat melihat console.log
apabila berjalan dengan binaan pengeluaran.
Bolehkah seseorang membimbing saya mengapa ia tidak berkesan? :)
Nilai
compulated()
返回一个ref
,因此您需要使用.value
来解开ref
:Demo 1
Sebagai alternatif, anda boleh menggunakan transformasi reaktif, yang tidak memerlukan sebarang pengembangan (tidak perlu
.value
)。不要导入ref
和compulated
,而是使用$ref
和$compulated
(tiada import diperlukan):Demo 2
Satu lagi masalah yang anda lihat ialah apabila atribut
wildcardItem
更改时,items
未更新。您需要重构您的解决方案,使items
成为基于附加到自定义事件项目的wildcardItem
的compulated
:Demo 3