uniapp flex:1不生效

包裹view顶层 不能添加 display: flex;
<template>
	<view class="container">
		<tHeader :title="'采购管理'" :showScrollTar="true" :scroll="scroll" :tabList="tabList" :isFixed="true"
			@change="changeTar" :current='current'>
		</tHeader>
		<view class="container-content-box">
			<view v-for="(item,index) in inventoryCostList" :key="index">
				<view class="cost-item-title-box">
					<uni-icons type="staff" color="#2167FF" size="24"></uni-icons>
					<view class="cost-item-title-name-box">
						{
  {item.deptName}}
					</view>
				</view>
				<view class="cost-item-content-box">
					<view class="cost-item-content-flex-box">
						<view class="cost-item-content-flex-name-box">
							自采成本
						</view>
						<view class="cost-item-content-flex-value-box">
							¥{
  {item.selfPrice}}
						</view>
					</view>
					<view class="cost-item-content-flex-box">
						<view class="cost-item-content-flex-name-box">
							采购调拨成本
						</view>
						<view class="cost-item-content-flex-value-box">
							¥{
  {item.allotPrice}}
						</view>
					</view>
					<view class="cost-item-content-flex-box">
						<view class="cost-item-content-flex-name-box">
							采购调拨成本
						</view>
						<view class="cost-item-content-flex-value-box">
							¥{
  {item.allotPrice}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<style lang="scss">
	.container {
		background-color: #F4F8FB;
		height: 100%;
		width: 100%;

		.btn-box {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			padding-right: 24rpx;
			color: #FFF;
		}

		.container-title-height {
			height: calc(var(--status-bar-height) + 150rpx);
		}

		.date-picker-box {
			background-color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
			color: #00327D;
			font-size: 30rpx;
			line-height: 30rpx;
			padding: 30rpx 0;

			.date-icon {
				display: inline-block;
				width: 30rpx;
				height: 30rpx;
			}

			.start-text {
				padding-left: 20rpx;
			}

			.date-connect {
				padding: 0 8rpx;
			}
		}

		.container-content-box {
			background-color: #FFF;
			border-radius: 10rpx;
			margin: 25rpx;
			padding: 25rpx;

			.cost-item-title-box {
				display: flex;
				align-items: center;
				justify-content: center;
				color: #333;
				flex-direction: row;

				.cost-item-title-name-box {
					font-size: 30rpx;
					font-weight: bold;
				}
			}

			.cost-item-content-box {
				background-color: #F7FAFF;
				padding: 25rpx;
				margin: 20rpx;
				flex-direction: row;
				border-radius: 10rpx;
				display: flex;

				.cost-item-content-flex-box {
					display: flex;
					flex: 1;
					align-items: center;
					justify-content: center;
					color: #333;
					flex-direction: column;

					.cost-item-content-flex-name-box {
						color: #666;
						display: flex;
						font-size: 26rpx;
					}

					.cost-item-content-flex-value-box {
						color: #333;
						font-size: 24rpx;
						margin-top: 15rpx;
						font-weight: bold;
					}
				}
			}
		}
	}
</style>

这一层级,不能写display: flex;写了底下的 flex:1 不生效
.container-content-box{}

相关推荐

  1. uniapp flex:1生效

    2023-12-12 07:40:06       54 阅读
  2. vscode git stash apply stash@{1}生效

    2023-12-12 07:40:06       37 阅读
  3. clickhouse ttl生效

    2023-12-12 07:40:06       32 阅读
  4. jsonfield注解生效

    2023-12-12 07:40:06       45 阅读
  5. docker运行nginx生效

    2023-12-12 07:40:06       61 阅读
  6. SpringMVC校验注解生效

    2023-12-12 07:40:06       59 阅读
  7. linux rc.local生效

    2023-12-12 07:40:06       36 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2023-12-12 07:40:06       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2023-12-12 07:40:06       100 阅读
  3. 在Django里面运行非项目文件

    2023-12-12 07:40:06       82 阅读
  4. Python语言-面向对象

    2023-12-12 07:40:06       91 阅读

热门阅读

  1. 什么是rocketmq❓

    2023-12-12 07:40:06       51 阅读
  2. Python从门到精通(九):numpy科学计算库

    2023-12-12 07:40:06       60 阅读
  3. Python中求取数字位数的方法

    2023-12-12 07:40:06       59 阅读
  4. 线上问题得解决

    2023-12-12 07:40:06       58 阅读
  5. Spring-xml版本

    2023-12-12 07:40:06       67 阅读
  6. Mysql mybatis 语法示例

    2023-12-12 07:40:06       68 阅读
  7. Docker与K8s的区别

    2023-12-12 07:40:06       70 阅读
  8. x的平方根算法(leetcode第69题)

    2023-12-12 07:40:06       63 阅读
  9. Flask存储在内存中的密钥被读取

    2023-12-12 07:40:06       58 阅读