收藏
回答

最新版开发工具 1.6.6 自定义组件样式不渲染

问题模块
API和组件

开发环境 win7 64  ,微信开发工具 1.6.6

我按照官方demo的自定义组件

cpt.wxml

<view class="inner">
   {{innerText}}
view>
<slot>slot>

cpt.wxss

.inner {
   color: red;
}

cpt.js

Component({
   properties: {
       // 这里定义了innerText属性,属性值可以在组件使用时指定
       innerText: {
           type: String,
           value: 'default value',
       }
   },
   data: {
       // 这里是一些组件内部数据
       someData: {}
   },
   methods: {
       // 这里是一个自定义方法
       customMethod: function(){}
   }
})

cpt.json

{
 "component": true
}

然后在 list.wxml

<view>
   <component-tag-name inner-text="Some text">component-tag-name>
view>

出来的效果是
字体样式没有改变

最后一次编辑于  2017-12-06  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

22 个回答

  • LastLeaf
    LastLeaf
    2018-04-12

    你好,无关的问题请单列一帖提问。


    对于这个问题,因为组件间的样式是相互隔离的,这样做不行。应当考虑 css import 的方式。


    2018-04-12
    赞同
    回复
  • LastLeaf
    LastLeaf
    2018-04-09

    这里明确一点: slot 节点本身属于自定义组件, slot 节点内的内容属于组件的使用者(也就是页面)。


    这个是自定义组件体系的模型规则,可以保证即使组件调用关系非常复杂的时候,节点的归属者永远是这个节点的 wxml 对应的组件或页面。


    如果你需要组件间样式共享,请考虑 CSS import 之类的方法。

    2018-04-09
    赞同
    回复
  • LastLeaf
    LastLeaf
    2018-04-09

    工具上现在不会显示slot,这个是工具展示节点树的方式,不会影响这个问题。至于没有应用样式的问题,请再检查一下你的代码。需要注意的是,


    .iconfont {

      font-size: 18pt;

    }


    这个,因为 view slot="icon" class="icon iconfont icon-CS" 这个节点是写在页面里面的,所以你要把这段wxss写在页面的wxss才会有效。


    2018-04-09
    赞同
    回复
  • LastLeaf
    LastLeaf
    2018-04-09

    你这个例子里面的这些节点,只有 view slot="icon" class="icon iconfont icon-CS" 这个节点会应用这个样式哦。请检查你的代码。

    2018-04-09
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-12-28

    @陈蕾 应该不是同一个问题,麻烦另开一帖并提供更详细的描述。

    2017-12-28
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-12-06

    你好,麻烦尝试一下以下步骤:
    1. 在开发者工具调试器中输入openVendor并回车;
    2. 开发者工具会打开一个文件夹,请删除这个文件夹下的所有文件;
    3. 关闭并重启开发者工具,看看这个问题是否还存在。

    2017-12-06
    赞同
    回复
  • 秋子
    秋子
    2018-04-12

    我的场景就是。tab 这个组件 100个页面可能都会用到。但是100个页面 tab的背景颜色或者是 tab里面的 某个节点背景颜色不一样 这个时候我需要怎么做。因为我目前通过页面最高层的view 给类名去改变是不可以的,请问我需要怎么处理

    2018-04-12
    赞同
    回复
  • 秋子
    秋子
    2018-04-12

    @LastLeaf 你好 我没理解你说的 css import 

    2018-04-12
    赞同
    回复
  • 秋子
    秋子
    2018-04-12

    @LastLeaf 

    wxml结构如下:

    想通过类名themeA 去改变c-cell组件里面 某个节点的样式。。。


    2018-04-12
    赞同
    回复
  • 秋子
    秋子
    2018-04-12

    @LastLeaf  亲 我还有个小问题就是。我想通过外部引入css去改组件里面的类名的样式怎么做?

    场景:A页面 引用了 tab组件 ,组件内 view .tab  background:red

    问题:通过app.wxss 改变.tab background发现不行,请问需要怎么做,externalClasses 的属性好像不是我想要的

    2018-04-12
    赞同
    回复

正在加载...