乐趣区

关于vue.js:vue模板中定义使用临时变量

有时候在模板中循环中,须要去计算一个值,并且屡次应用。因为是一个循环,所以不太好应用 computed,就不得不须要屡次计算

<li v-for="(item,index) in list" :key="index">
  <div>{{method(item.key)}}</div>
  <div>{{method(item.key)}}</div>
</li>

这种状况能够在模板中长期定义一个长期变量

<li v-for="(item,index) in list" :key="index" :data-var="value = method(item.key)">
  <div>{{value}}</div>
  <div>{{value}}</div>
</li>

并不是只能应用 data-var,这个是随便写的,只是一个承载这个长期变量的载体,你也能够这样写。

<li v-for="(item,index) in list" :key="index">
  <div style="display:none;">{{value = method(item.key)}}</div>
  <div>{{value}}</div>
  <div>{{value}}</div>
</li>
退出移动版