组件创建, components/test.vue
<template>
<view>
这是test组件
</view>
</template>
<script>
export default {
data() {
return {
}
},
beforeCreate() {
console.log('实例已经开始初始化了')
},
created() {
console.log('实例初始化完成')
},
beforeMount() {
console.log('before mount')
},
mounted() {
console.log('mounted')
},
onReady() {
console.log('页面初次渲染完成了')
},
destroyed() {
console.log('组件销毁了')
}
}
</script>
<style>
</style>
组件使用
<template>
<view class="content">
<test></test>
</view>
</template>
<script>
import test from '../../components/test.vue'
export default {
data() {
return {
}
},
methods: {
},
components: {
test
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
</style>