本文阅读量 次
1. 这里是 Vue 学习笔记¶
1.1 缩写指令¶
@
v-on
绑定事件:
v-bind
绑定属性#
v-slot
绑定插槽
1.2 app.config.globalProperties
如何使用¶
1.3 监听对象中某个属性的变化¶
<template>
<div>
<div>{{obj.name}}</div>
<div>{{obj.age}}</div>
<button @click="changeName">改变值</button>
</div>
</template>
<script>
import { reactive, watch } from 'vue';
export default {
setup(){
const obj = reactive({
name:'zs',
age:14
});
const changeName = () => {
obj.name = 'ls';
};
watch(() => obj.name,() => {
console.log('监听的obj.name改变了')
})
return {
obj,
changeName,
}
}
}
</script>
watchEffect
会监听引用数据类型的所有属性,不需要具体到某个属性,一旦运行就会立即监听,组件卸载的时候会停止监听
1.1¶
名称 | 作用 |
---|---|
app.provide() | 提供一个可以在所有descendant组件使用的值 |
<KeepAlive> | 缓存组件实例 |
watchEffect() | 立即运行一个函数,同时响应式地追踪其依赖,并在依赖更改时重新执行。 |
为了从 store 中提取属性时保持其响应性,你需要使用 storeToRefs()
toValue()
是 3.3 版本引入的新的 API, 和 unref
类似,但可以接受函数作为输入值
1.1.1 reactive
和 ref
的区别是什么¶
1.2 组合式API (Hooks)¶
无渲染组件或者轻量级组件?