behavior
necessitates definition via the Behavior()
constructor.// my-behavior.jsmodule.exports = Behavior({behaviors: [],properties: {myBehaviorProperty: {type: String}},data: {myBehaviorData: {}},attached() {},methods: {myBehaviorMethod() {}}})
behaviors
definition section.// my-component.jsconst myBehavior = require('my-behavior')Component({behaviors: [myBehavior],properties: {myProperty: {type: String}},data: {myData: {}},attached() {},methods: {myMethod() {}}})
my-component
definition incorporates my-behavior
, which contains the myBehaviorProperty
property, myBehaviorData
data field, myBehaviorMethod
method, and an attached
lifecycle function. This results in my-component
ultimately including two properties, myBehaviorProperty
and myProperty
, two data fields, myBehaviorData
and myData
, and two methods, myBehaviorMethod
and myMethod
. When the component triggers the attached
lifecycle, it sequentially triggers the attached
lifecycle function in my-behavior
and the attached
lifecycle function in my-component
.behavior
can contain fields with identical names. The handling methods for these fields are as follows:behavior
. If multiple behaviors
are referenced, the properties or methods in the later behavior
in the definition section will override the earlier ones.behavior
is referenced multiple times by a component, its defined lifecycle function will only be executed once.behavior
.Component({behaviors: ['wx://form-field']})
wx://form-field
represents a built-in behavior
, endowing this custom component with behavior akin to that of a form control.behavior
often adds certain attributes to a component. Unless otherwise specified, the component can override these attributes to alter its type
or add a observer
.Attribute | Types | Description |
name | string | Field Name in the Form |
value | Any | Field Value in the Form |
export
definition segment. This definition segment can be used to specify the return value when the component is called by selectComponent
.selectComponent
will return the this
plugin of the custom component (the custom component will return null
). When this definition segment is used, it will be replaced by the return value of the function in this definition segment.// Inside the custom component my-componentComponent({behaviors: ['wx://component-export'],export() {return {myField: 'myValue'}}})
<!-- When using the custom component --><my-component id="the-id" />
this.selectComponent('#the-id') // Equals { myField: 'myValue' }
Was this page helpful?