项目更新Vue笔记

script中琐碎知识点

data

数据类型

data：Object | Function
限制：组件的定义只接受 function。

那么vue中组件的定义是什么呢？

1.是一个可以重复使用的Vue是可以复用的Vue实例。
2.new Vue（）是一个Vue实例。
3.组件与实例接收相同的选项，如methods，computed、watch、data以及生命周期钩子等。但是el是根实例特有的。

｀即Vue项目中的.vue文件都可以叫做组件。它不限于component文件夹下的.vue文件，也可以认为这些文件复用度更高。

总结：data在用例中的类型可以是Object | Function
data在vue项目中的类型只能是 Function
函数中包含return出的对象{}

data:function(参数){
   return对象}  或者  data(){
   return对象}

代码格式

export default抛出的整体是一个对象，而其中是多个函数，如data()、created()等生命周期是函数；但是methods()是对象
> 对象【key:value】

<script>
export default {
   
   data: function () {
   
    return {
   
      overlay: false,
    };
  },
  methods: {
   },
};
</script>

其中，data的书写格式有如下几种

data: function () {
   
    return {
   
      overlay: false,
    };
  },

  date() {
   
    // 语句，以 ；间隔
    return {
   
        // 对象，以 ， 间隔
      overlay: false,
    };
  },

//使用箭头函数
date: () => {
   
   return{
   
      overlay: false,
    }
 },

//箭头函数只有一个表达式的时候可以省略关键字return
//为了去掉return，就要形成一个表达式，对象{overlay:false}加上圆括号（）
//由此，可去掉去掉return 和最外层{}，如下：
data: () => ({
   
      overlay: false,
    }),

methods

数据类型

methods：{ [key: string]: Function }
无论是实例还是项目/组件，数据类型都是函数
注意，不应该使用箭头函数来定义 method 函数

methods:{
   字符串类型的key:函数Function(参数){
   函数体}