Vue.js3v-model不适用于生产构建中的select

Question

我有一个问题，选择输入上的v模型在生产构建中不再工作。

代码：

<script setup>
import BreezeGuestLayout from '@/Layouts/Guest.vue';
import {Head, Link} from '@inertiajs/inertia-vue3';
</script>
<template>
<BreezeGuestLayout>
<div class="m-4">
<div class="d-flex align-items-center mb-8">
<select v-model="selected_event">
<option
v-for="event_date in event_dates"
:value="event_date"
>
{{ event_date.weekday }}: {{ event_date.start_date }}, {{ event_date.select_text }}
</option>
</select>
</div>
<h4 v-if="selected_event">
Selected Event: {{ selected_event.select_text }} at {{ selected_event.start_date }}
</h4>
</div>
</BreezeGuestLayout>
</template>
<script>
export default {
name: "BookingIndex",
data() {
return {
event_dates: [
{
id: 1,
start_date: "2022-10-30",
weekday: "Sunday",
select_text: "Joes Birthday",
},
{
id: 1,
start_date: "2022-11-14",
weekday: "Monday",
select_text: "Wedding-Day",
}
],
selected_event: null,
}
}
}
</script>

它在开发构建(npm run dev(中有效，但在生产构建(npm run build(中无效。

在我浏览器的开发控制台中，它显示了以下错误：

Uncaught ReferenceError: selected_event is not defined
at d.onUpdate:modelValue.n.<computed>.n.<computed> [as _assign] (Demo.816a5ac5.js:1:608)
at HTMLSelectElement.<anonymous> (app.bb04c4f1.js:31:67729)

但我不理解这个错误，因为selected_events是定义的，在开发构建时它可以完美地工作。

我使用Laravel(9.19版本作为后端(和惯性(0.5.4版本(以及vue.js(3.2.31版本(

我希望有人能帮我或者给我一些建议。如果你需要更多信息，请告诉我。

Answer 1

经过长时间的研究，我从vuejs/core中找到了git-reo问题的解决方案。(感谢xcash(

我想问题是这两个脚本部分和竞争，你必须选择其中一个来使用v模型。

以下是GitHub问题的链接：https://github.com/vuejs/core/issues/5584#issuecomment-1228348819