悬停显示完整内容，css修改伪元素的值

1.修改伪元素content的值

绑定属性值data-content-before，data-content-after

<!-- 动态修改伪元素的值——实现悬浮显示完整内容 -->
		<view class="title" :data-content-before="title">
			<p>{{title}}</p>
		</view>

title: '修改伪元素content，实现鼠标悬停显示完整内容--data-content-before'

在css中引用 content: attr(data-content-before);

.title {
		width: 400upx;
		position: relative;

		&::before {
			content: attr(data-content-before);
			position: absolute;
			top: 100%;
			left: 0;
			background-color: #FFFFFF;
			border: 2upx solid #333333;
			color: #333;
			z-index: 10;
			padding: 0 4upx;
			line-height: 1.3;
			display: none;
		}

		p {
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}

	.title:hover::before {
		display: block;
	}

2.修改伪元素样式

绑定样式 :style="{'--color':tColor}"

<view :style="{'--color':tColor}">
</view>

data
tColor: '#666',

css
color: var(--color);