fuint-uniapp-master/uni_modules/uni-row/components/uni-col/uni-col.vue

（开头部分） 7KB

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

<template>
	<!-- #ifndef APP-NVUE -->
	<view :class="['uni-col', sizeClass, pointClassList]" :style="{
		paddingLeft:`${Number(gutter)}rpx`,
		paddingRight:`${Number(gutter)}rpx`,
	}">
		<slot></slot>
	</view>
	<!-- #endif -->
	<!-- #ifdef APP-NVUE -->
	<!-- 在nvue上，类名样式不生效，换为style -->
	<!-- 设置right正值失效，设置 left 负值 -->
	<view :class="['uni-col']" :style="{
		paddingLeft:`${Number(gutter)}rpx`,
		paddingRight:`${Number(gutter)}rpx`,
		width:`${nvueWidth}rpx`,
		position:'relative',
		marginLeft:`${marginLeft}rpx`,
		left:`${right === 0 ? left : -right}rpx`
	}">
		<slot></slot>
	</view>
	<!-- #endif -->
</template>

<script>
	/**
	 * Col	布局-列
	 * @description	搭配uni-row使用，构建布局。
	 * @tutorial	https://ext.dcloud.net.cn/plugin?id=3958
	 *
	 * @property	{span} type = Number 栅格占据的列数
	 * 						默认 24
	 * @property	{offset} type = Number 栅格左侧的间隔格数
	 * @property	{push} type = Number 栅格向右移动格数
	 * @property	{pull} type = Number 栅格向左移动格数
	 * @property	{xs} type = [Number, Object] <768px 响应式栅格数或者栅格属性对象
	 * 						@description	Number时表示在此屏幕宽度下，栅格占据的列数。Object时可配置多个描述{span: 4, offset: 4}
	 * @property	{sm} type = [Number, Object] ≥768px 响应式栅格数或者栅格属性对象
	 * 						@description	Number时表示在此屏幕宽度下，栅格占据的列数。Object时可配置多个描述{span: 4, offset: 4}
	 * @property	{md} type = [Number, Object] ≥992px 响应式栅格数或者栅格属性对象
	 * 						@description	Number时表示在此屏幕宽度下，栅格占据的列数。Object时可配置多个描述{span: 4, offset: 4}
	 * @property	{lg} type = [Number, Object] ≥1200px 响应式栅格数或者栅格属性对象
	 * 						@description	Number时表示在此屏幕宽度下，栅格占据的列数。Object时可配置多个描述{span: 4, offset: 4}
	 * @property	{xl} type = [Number, Object] ≥1920px 响应式栅格数或者栅格属性对象
	 * 						@description	Number时表示在此屏幕宽度下，栅格占据的列数。Object时可配置多个描述{span: 4, offset: 4}
	 */
	const ComponentClass = 'uni-col';

	// -1 默认值，因为在微信小程序端只给Number会有默认值0
	export default {
		name: 'uniCol',
		// #ifdef MP-WEIXIN
		options: {
			virtualHost: true // 在微信小程序中将组件节点渲染为虚拟节点，更加接近Vue组件的表现
		},
		// #endif
		props: {
			span: {
				type: Number,
后面还有 256 行代码，购买后查看完整代码

24 小时内免费解锁 3 个项目，之后 1 算力/个。 规则说明

AI 解读 AI

登录后可用，每次 10 算力，解读结果公开显示在下面。

还没有人解读过这个文件。