本文介绍了VueJs 组件未定义的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
限时送ChatGPT账号..我是 vue.js.组件 comp1
似乎不起作用.
HTML
<comp1></comp1>
脚本
var data1={selected: null, items:["degradant", "impurity"]};Vueponent('comp1, {模板:'<select v-model="selected"><option disabled value="">请选择</option><option v-for="item in items" :value="item">{{item}}</option></选择>',数据:函数(){返回数据1}});新的 Vue({el: '#example-2'})
解决方案 你的组件应该是这样的:
Vueponent('comp1', {模板:`<select v-model="selected"><option disabled value="">请选择</option><option v-for="item in items" :value="item">{{item}}</option></选择>`,数据:函数(){返回数据1}});
您在这里缺少一个单引号:'comp1, {
,并且您必须用反引号将多行模板括起来,`.
console.clear()var data1={selected: null, items:["degradant", "impurity"]};Vueponent('comp1', {模板:`<select v-model="selected"><option disabled value="">请选择</option><option v-for="item in items" :value="item">{{item}}</option></选择>`,数据:函数(){返回数据1}});新的 Vue({el: '#example-2'})
<script src="https://unpkg/vue@2.4.2"></script><div id="example-2"><comp1></comp1>
I am new to vue.js. The component, comp1
doesn't appear to work.
HTML
<div id="example-2">
<comp1></comp1>
</div>
Script
var data1={selected: null, items:["degradant", "impurity"]};
Vueponent('comp1, {
template:'<select v-model="selected">
<option disabled value="">Please select</option>
<option v-for="item in items" :value="item">{{item}}</option>
</select>',
data: function(){
return data1
}
});
new Vue({
el: '#example-2'
})
解决方案
Your component should look like this:
Vueponent('comp1', {
template:`<select v-model="selected">
<option disabled value="">Please select</option>
<option v-for="item in items" :value="item">{{item}}</option>
</select>`,
data: function(){
return data1
}
});
You were missing a single quote here: 'comp1, {
, and you have to surround multi-line templates with backticks, `.
console.clear()
var data1={selected: null, items:["degradant", "impurity"]};
Vueponent('comp1', {
template:`<select v-model="selected">
<option disabled value="">Please select</option>
<option v-for="item in items" :value="item">{{item}}</option>
</select>`,
data: function(){
return data1
}
});
new Vue({
el: '#example-2'
})
<script src="https://unpkg/vue@2.4.2"></script>
<div id="example-2">
<comp1></comp1>
</div>
这篇关于VueJs 组件未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论