From e096c08a2c2e0125597911469a4917164af835a2 Mon Sep 17 00:00:00 2001
From: Alex <115539090+Alex-Programer@users.noreply.github.com>
Date: Fri, 18 Nov 2022 16:21:09 +0800
Subject: [PATCH] docs: update vue.md (#136)

---
 docs/vue.md | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/docs/vue.md b/docs/vue.md
index 8c85dd4f..81888700 100644
--- a/docs/vue.md
+++ b/docs/vue.md
@@ -422,6 +422,28 @@ export default defineComponent({
 });
 ```
 
+### 响应式样式
+
+```js
+<script setup>
+import { ref } from 'vue'
+const open = ref(false);
+</script>
+
+<template>
+  <button @click="open = !open">Toggle</button>
+  <div>Hello Vue!</div>  
+</template>
+
+<style scope>
+  div{
+    transition: height 0.1s linear;
+    overflow: hidden;
+    height: v-bind(open ? '30px' : '0px');
+  }
+</style>
+```
+
 响应式进阶 —— watch和computed
 ---