我的vue组件是这样的:
<template>
<div>
<div class="panel-group"v-for="item in list">
<div class="col-md-8">
<div class="alert">
{{ status = item.received_at ? item.received_at : item.rejected_at }}
<p v-if="status">
{{ status }} - {{ item.received_at ? 'Done' : 'Cancel' }}
</p>
<p v-else>
Proses
</p>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
...
computed: {
list: function() {
return this.$store.state.transaction.list
},
...
}
}
</script>
我想定义status
变量
因此,status
变量可用于条件
我试着这样:
{{ status = item.received_at ? item.received_at : item.rejected_at }}
但是,似乎错了
我如何正确定义?
答案 0 :(得分:3)
您可以使用某种方法来获取功能,因为item
变量不会出现在v-for
...
<div class="alert">
<p v-if="status(item)">
{{ status(item) }} - {{ item.received_at ? 'Done' : 'Cancel' }}
</p>
<p v-else>
Proses
</p>
</div>
...
并在组件中:
methods: {
...
status (item) {
return (item)
? (item.received_at) ? item.received_at : item.rejected_at
: false
}
...
}
答案 1 :(得分:1)
您需要使用data
:
export default {
...
data: function() {
return {
status: false
}
},
computed: {
list: function() {
return this.$store.state.transaction.list
},
...
}
}