|
学习之中遇到一个坑
源代码里面是scope=“scope”,然而slot-scope vue2.5版本中取代了scope。
<el-table :data="tableData" border show-summary style="width: 100%" >
<el-table-column prop="goodsName" label="商品" ></el-table-column>
<el-table-column prop="count" label="量" width="50"></el-table-column>
<el-table-column prop="price" label="金额" width="70"></el-table-column>
<el-table-column label="操作" width="100" fixed="right">
<template scope="scope">
<el-button type="text" size="small">删除</el-button>
<el-button type="text" size="small">增加</el-button>
</template>
</el-table-column>
</el-table> scope="scope">
<el-button type="text" size="small">删除</el-button>
<el-button type="text" size="small">增加</el-button>
</template>
</el-table-column>
</el-table>
然后elementUI的样式有时候很尴尬,
el-tabs文字都是左贴边的,用标签选择器加样式没作用,打开开发者模式,它根本没这个标签,是div加的类名而已,所以这种情况是直接写内联样式哒

<div class="goods-type">
<el-tabs style="padding-left:10px">
<el-tab-pane label="汉堡">
<div class="cookList">
<ul>
<li v-for="(goods,index) in type0Goods" :key="index">
<span class="foodImg"><img :src="goods.goodsImg" width="100%"></span>
<span class="foodName">{{goods.goodsName}}</span>
<span class="foodPrice">¥{{goods.price}}元</span>
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane label="小食">小食</el-tab-pane>
<el-tab-pane label="饮料">饮料</el-tab-pane>
<el-tab-pane label="套餐">套餐</el-tab-pane>
</el-tabs>
</div>style="padding-left:10px">
<el-tab-pane label="汉堡">
<div class="cookList">
<ul>
<li v-for="(goods,index) in type0Goods" :key="index">
<span class="foodImg"><img :src="goods.goodsImg" width="100%"></span>
<span class="foodName">{{goods.goodsName}}</span>
<span class="foodPrice">¥{{goods.price}}元</span>
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane label="小食">小食</el-tab-pane>
<el-tab-pane label="饮料">饮料</el-tab-pane>
<el-tab-pane label="套餐">套餐</el-tab-pane>
</el-tabs>
</div>
今天暂时碰到这些问题,明天踏入新的旅程啦 |