diff --git a/docs/changelog/2025-03-13-style-keys.md b/docs/changelog/2025-03-13-style-keys.md new file mode 100644 index 000000000..cd13475e5 --- /dev/null +++ b/docs/changelog/2025-03-13-style-keys.md @@ -0,0 +1,8 @@ +# 样式 key 统一为 kebab-case + +## 变更摘要 + +- **helper.js**:`getGlobalBaseStyle` 中边距样式由 camelCase 改为 kebab-case(`paddingTop` → `padding-top` 等)。 +- **location-module**:导航项内联样式 `borderRadius`、`backgroundColor`、`paddingLeft`/`paddingRight` 改为 `border-radius`、`background-color`、`padding-left`/`padding-right`。 + +便于小程序等环境正确解析内联样式。 diff --git a/src/pages/home/wgts/helper.js b/src/pages/home/wgts/helper.js index 1178295c6..edaeae2c0 100644 --- a/src/pages/home/wgts/helper.js +++ b/src/pages/home/wgts/helper.js @@ -122,19 +122,19 @@ export function getGlobalBaseStyle(baseStyle) { // 处理边距 if (baseStyle.paddedt !== undefined && baseStyle.paddedt !== null) { - style.paddingTop = Taro.pxTransform(baseStyle.paddedt) + style['padding-top'] = Taro.pxTransform(baseStyle.paddedt) } if (baseStyle.paddedb !== undefined && baseStyle.paddedb !== null) { - style.paddingBottom = Taro.pxTransform(baseStyle.paddedb) + style['padding-bottom'] = Taro.pxTransform(baseStyle.paddedb) } if (baseStyle.paddedl !== undefined && baseStyle.paddedl !== null) { - style.paddingLeft = Taro.pxTransform(baseStyle.paddedl) + style['padding-left'] = Taro.pxTransform(baseStyle.paddedl) } if (baseStyle.paddedr !== undefined && baseStyle.paddedr !== null) { - style.paddingRight = Taro.pxTransform(baseStyle.paddedr) + style['padding-right'] = Taro.pxTransform(baseStyle.paddedr) } // 处理背景 diff --git a/src/pages/home/wgts/location-module/index.jsx b/src/pages/home/wgts/location-module/index.jsx index 0ac1611fc..7d1e5b172 100644 --- a/src/pages/home/wgts/location-module/index.jsx +++ b/src/pages/home/wgts/location-module/index.jsx @@ -64,7 +64,7 @@ export default function WgtLocationModule(props) { const navitemarea = base.navitemarea || {} return { ...getGlobalBaseStyle(navitemarea), - borderRadius: base.navitemradius ? Taro.pxTransform(base.navitemradius) : 0 + 'border-radius': base.navitemradius ? Taro.pxTransform(base.navitemradius) : 0 } }, [base.navitemarea, base.navitemradius]) @@ -74,11 +74,11 @@ export default function WgtLocationModule(props) { return { height: Taro.pxTransform(base.navitemheight || 40), color: textColor, - backgroundColor: isActive + 'background-color': isActive ? item.navitemactivebg || 'transparent' : item.navitembg || 'transparent', - paddingLeft: `${Taro.pxTransform(base.navitemmargin || 0)}`, - paddingRight: `${Taro.pxTransform(base.navitemmargin || 0)}` + 'padding-left': `${Taro.pxTransform(base.navitemmargin || 0)}`, + 'padding-right': `${Taro.pxTransform(base.navitemmargin || 0)}` } }