• vue3黑马笔记

    一、创建vue3项目

    需要node16版本或者以上，

    npm init vue@latest

    • 1

    在这里插入图片描述

    二、vue3模块

    在这里插入图片描述

    在vue3中所有的创建都用了函数封装，保证了每个实例的独立性
    在这里插入图片描述

    三、setup

    1、setup选项

    setup组合式api
    1、执行时间比beforeCreate还早
    2、setup函数，获取不到this
    3、数据和函数需要return出去才可以使用
    在这里插入图片描述

    <script>
export default {

  setup(){
    console.log("setup", this)

    const message = "消息"
    const aaa = () =>{
      console.log("函数调用")
    }
    return {
      message,
      aaa
    }
  },
  beforeCreate() {
    console.log("beforeCreate")
  }
}
script>

<template>
  <div>{{message}}div>
  <button @click="aaa">点击按钮button>
template>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25

    2、setup语法糖（