目录

vue3.x组合式api

vue2 定义属性和方法

vue3 定义属性和方法

router 使用的区别

vue2.x router使用

定义router

在main.js中引入router

在vue中使用

vue3.x使用router

定义router

在main.js中引用

在vue中使用router

定义全局方法，变量

vue2.x定义全局方法

vue2.x中使用全局方法

vue3.x定义全局方法

vue3.x中使用全局方法

父子组件调用

vue2.x 父组件调用子组件

定义子组件

定义父组件

vue2.x子组件调用父组件

定义子组件

定义父组件

vue3.x父组件调用子组件

定义子组件

定义父组件

vue3.x子组件调用父组件

定义子组件

定义父组件

watch的使用

vue2.x使用watch

vue3.x使用watch

生命周期

vue2.x生命周期

vue3.x生命周期

根节点不同

总结

---

先了解vue3.x 的setup语法糖，这个语法糖的确好用，不用每个都去return，实际开发中经常忘记return，这个语法糖就很好用了，对于setup语法糖是3.2才支持的。主要讲解我们开发中经常用到的一些内容，包括 router，prototype,父子组件调用 等。

vue3.x组合式api

vue2 定义属性和方法

<template>
  <div>
    <div>简单属性</div>
    <div>{
  { msg }}</div>
    <div><button @click="updateMsg">修改马杀鸡</button></div>

    <div>对象属性</div>
    <div>{
  { ObjMsg.msg }}</div>
    <div><button @click="updateObjMsg">修改对象马杀鸡</button></div>
  </div>
</temp