prop: ['type', 'alertSubject'],
computed: {
alertTitle() {
let title = ""
if(this.alertSubject == "requestStatusUpdate") {
if(this.type == 'success') {
title = 'Status update is requested'
}
else if(this.type == 'waiting') {
title = 'Requesting status update'
}
else if(this.type == 'error') {
title = 'Status update not sent'
}
}
return title
},
}
我觉得这应该奏效,但事实并非如此。我所有的计算值只返回"0"的起始值;标题";是的。我是不是遗漏了一些显而易见的东西?
编辑:我错过了一些显而易见的东西,我是个白痴。很抱歉浪费了大家的时间,我错过了一个"s";关于";道具";
您的代码运行正常,就像下面的代码片段:
<html>
<head>
</head>
<body>
<div id="container">
Try "success", "waiting" or "error": <input type="text" id="container" placeholder="enter text" v-model="type">
<p>{{ value }}</p>
Message: {{alertTitle}} ...
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.11.10/vue.min.js"></script>
<script>
new Vue({
el: '#container',
data: {
alertSubject: "requestStatusUpdate", // Fake prop
type: "success", // Fake prop
},
computed: {
alertTitle() {
let title = ""
if (this.alertSubject == "requestStatusUpdate") {
if (this.type == 'success') {
title = 'Status update is requested'
} else if (this.type == 'waiting') {
title = 'Requesting status update'
} else if (this.type == 'error') {
title = 'Status update not sent'
}
}
return title
},
}
});
</script>
</body>
</html>
this.alertSubject
或this.type
不存在。
像一样打印这些值
<div>
alertSubject: {{alertSubject}}
type: {{type}}
</div>
这样你就可以看到这些值是否存在。