vue v-for和v-if 共存问题解决

做过后端开发  在模板引擎中经常会有foreach  循环 会遇到if 判断语句，因为foreach 包裹在循环体外面，所以很好就可以使用if判断，而在vue 中发现  v-for是在循环体上  在然后在用到v-if中总是报错  因为v-for 具有比 v-if 更高的优先级

所以 把v-for 放到循环体的父级

 <ul v-for="(item,i) in list.type_news_list" :key="i" v-show="btn_t || i<3">
              <li class="list-1 flex"  v-if="i===0">
                <div class="hot-img" >
                  <img :src="item.news_img" alt />
                  <span class="iconfont icon-bofang"></span>
                </div>
                <div class="hot-title">
                  <span class="hot-l">{{item.news_title}}</span>
                  <div class="flex hot-r">
                    <div>
                      <span class="iconfont icon-shipin"></span>
                      <span>{{item.news_num}}</span>
                    </div>
                    <div>
                      <span class="iconfont icon-shijian"></span>
                      <span>{{item.news_date}}</span>
                    </div>
                  </div>
                </div>
              </li>
              <li class="list-2 flex" v-else>
                <div class="list-2-r ellipsis">{{item.news_title}}</div>
                <div class="list-2-l">
                  <span class="iconfont icon-shipin"></span>
                  <span>{{item.news_num}}</span>
                </div>
              </li>
            
            </ul>