1.
<style lang="sass" scoped type="text/css"></style> 错误写法
报错:
<style lang="scss" scoped type="text/css"></style> 正确写法
2.
组件模板应该在最外层有个根元素,下面根元素为div
<div>
<!-- <p class="tit">您当前的手机套餐:<span>{{nowPackage}}</span></p> -->
<article id='fgList'>
<section class="fG_wrap" v-for="item in list">
<header class="pr">
<h3 class="pa" @click="showInfo(item.id)">{{ item.product_name }}<i class="show_detail"></i></h3>
<span class="pa tel"><i></i>{{ item.product_talktime }}分钟</span>
<span class="pa flow"><i></i>{{ item.product_flow }}</span>
<button class="pa btn_buy">订购</button>
</header>
<div class="detail" v-show="activeId==item.id">
<div class="rule"><p>{{ item.product_desc }}</p></div>
<div class="tips_tit">温馨提示:</div>
<div class="tips"><p>{{ item.second_tips }}</p></div>
</div>
</section>
</article>
<dialog-html></dialog-html>
</div>
3.
##没有根元素会报错
<article id='fgList'>
<section class="fG_wrap" v-for="item in list">
<header class="pr">
<h3 class="pa" @click="showInfo(item.id)">{{ item.product_name }}<i class="show_detail"></i></h3>
<span class="pa tel"><i></i>{{ item.product_talktime }}分钟</span>
<span class="pa flow"><i></i>{{ item.product_flow }}</span>
<button class="pa btn_buy">订购</button>
</header>
<div class="detail" v-show="activeId==item.id">
<div class="rule"><p>{{ item.product_desc }}</p></div>
<div class="tips_tit">温馨提示:</div>
<div class="tips"><p>{{ item.second_tips }}</p></div>
</div>
</section>
</article>
<dialog-html></dialog-html>
4.
根据错误提示知道是语法错误,于是更正