在不同的地方使用相同的Vue变量会产生错误

Question

我有一个包含根组件this.$root.translations和以下情况的翻译的数组

<div class="fashion-lounge-price ">
<h6><span v-if="item['service_price_discounted'] > 0">{{
item['service_price_discounted'] > 0 ? item['service_price']+ (item['service_price_max'] > item['service_price'] ? '-'+ item['service_price_max'] : '' ) : ''}} 
{{ this.$root.translations['t_lei'] }}</span>
{{item['service_price_discounted'] > 0 ? item['service_price_discounted']+(item['service_price_max'] > item['service_price'] ? '-'+((((item['service_price'] - item['service_price_discounted'])/item['service_price']) * 100)/100) * item['service_price_max'] : '') : item['service_price']+(item['service_price_max'] > item['service_price'] ? '-'+item['service_price_max'] : '' )}}
{{ this.$root.translations['t_lei'] }}
</h6> 
</div>

我第一次使用{{ this.$root.translations['t_lei'] }}工作没有问题。然而，它的第二次出现(在</h6>之上)抛出这个错误:[Vue warn]: Error in render: "TypeError: this is undefined"
但是，在组件的其他任何地方使用它，除了那个地方，不会抛出任何错误，并且工作。

我有什么遗漏的吗?

Answer 1

你不必在模板区域写this。请删除后再试。

使用this，您可以访问脚本区域中的所有方法或响应数据。我希望您可以从vue文档

中了解更多有关它的信息。