uni-app 钉钉小程序中通过 v-bind 绑定多个属性无效

uni-app 钉钉小程序中通过 v-bind 绑定多个属性无效

示例代码：

<template>  
  <view v-bind="{ style: { color: 'red' } }">xxx</view>  
</template>

操作步骤：

将代码

<template>  
  <view v-bind="{ style: { color: 'red' } }">xxx</view>  
</template>

复制到编辑器

预期结果：

style 生效，字体变红色

实际结果：

style 不生效，字体不变色

bug描述：

钉钉小程序中通过 v-bind 绑定多个属性无效

图片

Image 1

Image 2


更多关于uni-app 钉钉小程序中通过 v-bind 绑定多个属性无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

v-bind 可以传递 onclick/style 等动态添加的字段，在 web/app 上支持，uniapp 在编译运行到小程序平台遵循小程序要求，小程序平台是不支持的。如果你使用 HBuilderX 运行会提示 not support
推荐明确指定 v-bind 内容，比如你提到的 v-bind:style

更多关于uni-app 钉钉小程序中通过 v-bind 绑定多个属性无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


原来如此，感谢大佬

这是一个钉钉小程序平台对v-bind对象语法支持的问题。在钉钉小程序环境下，直接使用v-bind绑定对象形式的style属性可能无法正确解析。

解决方案：

  1. 改为直接绑定style属性：
<view :style="{ color: 'red' }">xxx</view>
  1. 如果需要绑定多个属性，建议分开绑定：
<view :style="{ color: 'red' }" :class="someClass">xxx</view>
  1. 或者使用计算属性返回绑定对象：
computed: {
  bindObj() {
    return {
      style: { color: 'red' }
    }
  }
}

<view v-bind="bindObj">xxx</view>
回到顶部