tencent cloud

{
  "component": true
}

<!-- This represents the internal WXML structure of the custom component -->
<view class="inner">
  {{innerText}}
</view>
<slot></slot>

/* The styles here are solely applicable to this custom component */
.inner {
  color: red;
}

Component({
  properties: {
    // Here, the innerText attribute is defined, the value of which can be specified when the component is used.
    innerText: {
      type: String,
      value: 'default value',
    }
  },
  data: {
    // Here are some internal data of the component.
    someData: {}
  },
  methods: {
    // Here is a custom method.
    customMethod() {}
  }
})

{
  "usingComponents": {
    "component-tag-name": "path/to/the/custom/component"
  }
}

<view>
  <!-- Below is a reference to a custom component -->
  <component-tag-name inner-text="Some text"></component-tag-name>
</view>