Vue3基础技术语法

一、全局创建

app.use(createPinia()).mount()

二、全局方法

1、创建

```js
	app.config.globalProperties.xxx    在main.js页面进行创建
```

2、使用

```
getCurrentInstance().appContext.config.globalProperties.xxxxx   
  	使用getCurrentInstance 使用先引入  
import { getCurrentInstance } from "vue";
	注意:若是在template使用直接写 xxxxx 使用即可
```

三、setup

1、当做方法使用,里面所有的响应式,对象,方法,都需要return才能使用

```
	setup(props, context) {		
			const num = ref(5);
			const setnum = (v = 1) => {
				num.value = v
			}
			const msg = ref('你好msg')
			const setMsg = v => msg.value = v
			return {
				num,
				setnum,
				setMsg,
				msg
			}
		}
```

2、语法糖 直接在写<script setp></script>  即可,所有方法与变量不需return也能使用

四、响应式核心

1、ref

用来定义响应式值类型的变量,在script里面使用该变量的值需要 .value  使用先导入

```
var num =ref(1)    console.log(num.value)   num.value=10
```

 2、reactive

用来定义响应式引用类型的变量,也可以用ref来定义响应式对象但是多了一层obj.value.name

 

```
var obj=reactive({name:"xxx",age:"18"})   console.log(obj.name)
要是使用ref定义的引用类型就得多一层value   console.log(obj.value.name)
```

3、compouted

计算属性,与vue2有些许不同,vue2compouted是一个配置项  vue3他就是一个方法 但是都return