VUE真实项目中常用的生命周期和参数

Posted 2021-03-17 binmengxue

<template>
  <div class="first-app">
  {{msg}}
  <br/>
  {{msg1}}
  <Confin text=‘注册‘ @message="getMeaasge"></Confin>
  </div>
</template>
<script>
import Confin from ‘@/components/sub/Confin‘;
export default {
  name: ‘Fist‘,
  components: {Confin}, //注册组件,比如要插入另外一个写好的VUE文件买这个时候就需要添加
  props:[], //接受父亲的参数
  data () { 
    return {
      msg: ‘Welcome to Your FistApp ddddd‘
    }
  },
  mounted(){ //dom挂在完成 相当于onload，方法的调用
    //this.getMeaasge();
  },
  computed:{ //计算属性
    msg1(){
      return this.msg+‘1‘;
    }
  },
  methods:{ //这里面添加所有的方法
    getMeaasge(val){
      alert(val)
    }
  }
}
</script>
<style>
.first-app{
  color:#f00;
  font-size:40px;
}
</style>