如何将handlebars的if结构改写为vuejs的形式

Question

<div v-for="d in res">
    {{ifEQ order_status_id '1'}}
    <div data-page-url="{{urlBase}}pay/order?id={{d.order_id}}">
    {{else}}
    <div data-page-url="{{urlBase}}user/order/{{d.order_id}}">
    {{/ifEQ}}
    //
    // 一大段代码
    //
    </div>
</div>

如果单纯的用v-if结构写的话就必须写成：

<div v-for="d in res">
    <div v-if="d.order_status_id===1" data-page-url="{{urlBase}}pay/order?id={{d.order_id}}">
    //
    //一大段代码
    //
    </div>
    <div v-else data-page-url="{{urlBase}}user/order/{{d.order_id}}">
    //
    // 一大段代码
    //
    </div>
</div>

这样下面那一大段代码量很大的话就太累赘了，而且如果我在一大段代码中再有v-if的判断方法就会出现问题。
有没有更好的方法，比如监听order_status_id的值来对应返回不同的data-page-url，我尝试用watch，但是貌似循环中的值听不到的样子，求指点！

Answer 1

vue循环列表数据如果根据值显示不同的信息采用template

<div v-for="d in res">
     <template v-if="order_status_id  == 1"> 
       <div data-page-url="{{urlBase}}pay/order?id={{d.order_id}}"> </div>
     </template>
     <template v-if="order_status_id  == 2"> 
       <div data-page-url="{{urlBase}}pay/order?id={{d.order_id}}"> </div>
     </template>
</div>