子组件的使用

Posted baixinl

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了子组件的使用相关的知识,希望对你有一定的参考价值。

子组件的使用

.json中配置"usingComponents"字段,{"标签名": "子组件路径"}

"usingComponents": {
"x-blog-cart": "/components/blog-cart/blog-cart",
"x-blog-ctrl": "/components/blog-ctrl/blog-ctrl",
},
在.wxml中使用
 
 
<view class="detail-footer">
  <x-blog-ctrl
    iconfont="iconfont"
    icon-share="icon-share"
    icon-pinglun="icon-pinglun"
    blogId="{{blog._id}}"
  />
</view>
父组件给子组件传递样式:上面粉红色是部分
子组件接受(在Component(.js子组件有Component包裹) 中配置externalClasses属性):
//外部样式
externalClasses: [
‘iconfont‘,
‘icon-share‘,
‘icon-pinglun‘
],
注意:
iconfont="iconfont"
icon-share="icon-share"
icon-pinglun="icon-pinglun"
样式传递
由于有样式隔离,子组件想使用公共样式,需要传递
 

以上是关于子组件的使用的主要内容,如果未能解决你的问题,请参考以下文章

vue父组件向子组件传值

父组件访问子组件中的数据(父子组件通信案例:父组件访问子组件$refs[‘子组件‘],子组件传递数据给父组件(父组件中使用v-model))

在子组件中使用手表是否很糟糕?

使用 ViewChildren 访问子组件的指令

使用参数渲染 Blazor 子组件

如何使子组件使用父组件样式[重复]