前端小程序如何创建自定义组件

1、首先创建一个components目录，下面放文件(组件文件)

2、创建一个test组件

①test.wxml

<view>标题view>
<view>内容内容内容内容view>

②test.json

{
     
  "component": true,
  "usingComponents": {
     }
}

3、在pages文件夹里面，进入对应的模块内引用test组件

①局部引入组件

{
     
  "usingComponents": {
     
    "test":"/components/test/test"
  }
}

②全局引入,在app.json里面

usingComonents:{
     
      //test是自定义组件的名字，要与渲染到页面的标签一致  
     "test":"/components/test/test"
}

③在wxml中直接使用就会显示,两种均可

  <test/>

  <test>test>

自定义组件中和页面中的class名重名，是不会产生冲突的；
页面中的class和自定义组件中的class重名；同样不会产生冲突；