## 组件基本定义方法 ``` <style lang='less'> </style> <template> <div> <height-camera :isOpen="face_shows2" @ret-fun="retFun"></height-camera> <span>{{sum}}</span> </div> </template> <script> import { mailList } from '@/api/eventlist' import HeightCamera from '_c/height-camera' export default { components: { // 页面用到的组件 HeightCamera }, props:['a','b','c'], data () { // 页面的变量定义 return { face_shows2: true } }, computed: { // 计算属性 sum () { return 100 } }, methods: { // 页面里面用到的所有函数 fun1 () {}, fun2 (data) { this.$emit('ret-fun', data) } }, mounted () { // 初始化的js代码 mailList().then(ret => {}) // 调用接口 } } </script> ```