Question

v-if="css_max_count[i] == true可以正常工作，但是如果我添加return，则此代码不起作用。有什么原因吗？

短代码：

<div class="ui form" v-for="(im, i) in sorted_listim"> 
    <div  class="ui left pointing red basic label" v-if="css_max_count[i] == true">
        {{im.count_buy}}
    </div>

    <div @click="add_dar(i)" class="ui right small basic green button" ><h3>+</h3>
    </div>

</div>


add_dar(i) {
    if (im.count_buy < count) {
        this.css_max_count[i] = true
        // return - ??????
    } else this.css_max_count[i] = false
}

Answer 1

在表达式中添加返回值时，会发生错误，因为它会生成无效的javascript。
vue的v-if的工作方式是接受一个表达式，该表达式包装在一个新的Function对象中，该对象包含自己的返回值。

function checkExpression (exp: string, text: string, warn: Function, range?: Range) {
  try {
    new Function(`return ${exp}`)
  }
  ...
  ...

两者之间的区别是return css_max_count[i] == true与return return css_max_count[i] == true。

添加return会使函数无效，并引发错误。发生这种情况时，您应该已经在控制台中看到一个错误，因为无论环境如何，都会警告该错误。

请参见vue错误检测器中的checkExpression。

添加到“返回”功能时，“ v-if”不起作用。为什么？

1 个答案: