
在开发的需求中,需要通过设置rowClassName来设置不同的行样式,例如:
我发现,在样式中设置类adjust之后不会起作用
这样写并不会改变行的背景颜色
经过翻阅资料,别人也遇到过这样的问题,是因为adjust不能写在scoped当中,而应写在全局样式中
改成这样后样式生效,但要注意,这样可能会影响到其他组件中class为adjust的样式
DIV部分
<chart
ref="taskChart"
:theme="chartstheme"
autoresize :options="chartsoptionsu"
@click="zydwclick"
:style="{width:chartswidth,height:chartsheight}">
</chart>
<iframe width="100%" ref="mapIframe" class="rectCorner" id="zykhMapIframe" scrolling="no"
:src="YZKH_URL" :height="ifram_height"
frameborder="0">
</iframe>
data部分
charts:{
//div的高度
ifram_height:0,
//echarts的高度宽度
width:'100%',
height:"230px",}
//自动设置chart的高度
methods: {
RowResize() {
let me =this;
const deviceHeight = documentdocumentElementclientHeight
const chartHeight = (Number(deviceHeight) 082) /2//两个row
//计算echarts 的高度
mechartsheight = chartHeight +'px';
//计算div部分的高度
meifram_height = (Number(deviceHeight) 078) +'px'
},
在mountd里面调用
mounted() {
let me =this;
meRowResize();
//监视窗口发生变化再调用一次
windowonresize =function () {
meRowResize();
}
获取DOM的高度宽度公式
DOM可视高度/DOM最长的高度=计算比例
计算 table高度
<Table border
@on-sort-change="onSortChange"
:columns="tableAtableColumns"
:data="tableAtableData"
:height="height"
ref="currentRowTable"
:percent="percent"
style="white-space: nowrap;word-break: keep-all"
></Table>
data() {
return {
height:100,
//自动设置列表的高度
RowResize() {
let me =this;
const deviceHeight = documentdocumentElementclientHeight
if (me$refscurrentRowTable) {
meheight = Number(deviceHeight) 065
}
},
let me =this
meRowResize();
//监听窗口大小变化
windowonresize =function () {
meRowResize();
}
以上就是关于antd vue table 设置rowClassName不生效的问题全部的内容,包括:antd vue table 设置rowClassName不生效的问题、vue-echarts /div动态的计算高度、等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)