美好的一天。
我们正在使用https://github.com/vuejs/vue-hackernews-2.0
使用Vuejs / Vuex / vue-router构建我们的应用程序使用IE11构建和查看我们的应用程序时,我们得到一个SCRIPT1046: Multiple definitions of a property not allowed in strict mode
,它引用了编译的app.[#hash].js
文件。我在组件中跟踪了以下重复属性:
<div class="form-group form-group-list">
<label aria-labelledby="Shopping preference">Shopping preference</label>
<ul class="inline">
<li>
<label for="users__secondary_signup__gender__female" aria-labelledby="Gender female">
<span class="enhanced-radio" :class="{ 'selected': selectedGender === 'FEMALE' }">
<input id="users__secondary_signup__gender__female" class="enhance-radio"
:checked="selectedGender === 'FEMALE'" name="gender"
type="radio" value="FEMALE" v-model="selectedGender">
</span> Female
</label>
</li>
<li>
<label for="users__secondary_signup__gender__male" aria-labelledby="Gender male">
<span class="enhanced-radio" :class="{ 'selected': selectedGender === 'MALE' }">
<input id="users__secondary_signup__gender__male" class="enhance-radio"
:checked="selectedGender === 'MALE'" name="gender"
type="radio" value="MALE" v-model="selectedGender">
</span> Male
</label>
</li>
</ul>
</div>
编译文件中唯一的参考是:
domProps: {
checked: "MALE" === t.selectedGender,
checked: t._q(t.selectedGender, "MALE")
},
and
domProps: {
checked: "FEMALE" === t.selectedGender,
checked: t._q(t.selectedGender, "FEMALE")
},
我在编译文件中找不到对象中可能存在重复属性的任何地方。有没有人见过这个?我们是否在组件中做错了它是为了做到这一点?
谢谢,任何帮助表示赞赏。
答案 0 :(得分:4)
您不能同时使用v-model和:checked。添加v-model =“ selectedGender”时,您提供了一种基于selectedGender值确定检查状态的方法。这导致它创建以下代码:
已选中:t._q(t.selectedGender,“ MALE”)
当您还添加了:check =“ selectedGender ==='FEMALE'”时,您使它添加了另一种设置检查状态的方法:
选中:“女” === t.selectedGender,
不能同时拥有两者。只需删除:checked =即可解决此问题。
答案 1 :(得分:0)
要以@Charles答案为基础,其他重复属性也是如此。例如,您无法声明:value="myProperty"
和value="true"
,因为它会创建查尔斯答案中提到的类似代码。
只需删除重复属性即可解决此类问题。