Developers may implement multiple custom components. The Mini Program provides mixins
to help process the common logic of these components.
The following shows an example.
// /minxins/lifecylce.js
export default {
onInit(){},
deriveDataFromProps(nextProps){},
didMount(){},
didUpdate(prevProps,prevData){},
didUnmount(){},
};
Note:
onInit
and deriveDataFromProps
apply to basic library 1.14.0 and later versions. You can use my.canIUse('component2')
for compatibility.
// /pages/index/index.js
import lifecylce from './minxins/lifecylce';
const initialState = {
data: {
isLogin: false,
},
};
const defaultProps = {
props: {
age: 30,
},
};
const methods = {
methods: {
onTapHandler() {},
},
}
Component({
mixins: [
lifecylce,
initialState,
defaultProps,
methods
],
data: {
name: 'alipay',
},
});