公告列表
公告列表
收藏
回答

为什么给自定义组件添加style不生效？

我有个自定义组件myButton：

我在使用该组件的地方添加style属性，发现它不生效：

回答关注问题邀请回答
收藏

3 个回答

  • brave
    brave
    2020-04-15

    建议你用这个，貌似引用组件所在的那个页面写的样式对自定义组件无效

    2020-04-15
    有用 1
    回复 1
    • Toxic
      Toxic
      2020-04-16
      谢谢你的回答。令人奇怪的是，有些组件能传style进去，有些组件不行，这让我很迷惑。
      2020-04-16
      赞
      回复
  • 泽煌在广州
    泽煌在广州
    2023-02-10

    需要再加一个 display: block; 让页面渲染系统知道这个标签代表的组件是个块级结构，就可以生效了

    2023-02-10
    有用
    回复
  • Toxic
    Toxic
    2020-04-19

    很感谢Feb.提供的建议，但很多时候我只想在自定义组件上添加个margin和padding，如果使用externalClasses的话就太麻烦了。

    我现在统一给自定义组件添加`cstyle`属性来替代组件上的style,例如：

    <!-- 某个页面的WXML -->
<view>
  <myButton cstyle="margin-bottom:20rpx;">确定</myButton>
</view>

    myButton的代码如下

    // myButton的js
// components/myButton/index.js
Component({
  properties: {
    cstyle:{
      type:String,
      value:''
    }
  }
})



    <!-- myButton的WXML -->
<!-- components/myButton/index.wxml -->
<view style="{{cstyle}}" class="my-button">
  <slot></slot>
</view>

    2020-04-19
    有用
    回复
请 登录 后发表内容
相关问题
相关文档
问题标签
自定义组件