uniapp Adding class style or modifying style to custom components or uview and other ui components does not take effect in WeChat applets

reason:

First of all, whether it is a custom component or a ui component, the essential reason is the default component isolation strategy of the WeChat applet.
WeChat Mini Program Component Isolation Document Reference

The following solutions are based on different situations:

1. Modify the style on the original class

For example, in the original class (.u-radio) of the uview radio radio component, the modified style does not take effect

.u-radio {
		margin-right: 25px;
	}

Solution:
Add ::v-deep

::v-deep .u-radio {
		margin-right: 25px;
	}

2. Increase class

For example, I added a new class (myClass) to the uview radio radio component, but it did not take effect

.myClass {
		margin-right: 25px;
	}

Solution:
In the component to modify the style, add a WeChat applet configuration at the same level as the data

options: {
			styleIsolation: 'shared', // 解除样式隔离
		}

3. Inline styles (can take effect normally)

• Components accept styles via attributes (normal)
• The case of changing directly through the native style attribute (normal)