摘要： <template> <button v-has-show="'add'">创建</button> <button v-has-show="'delete'">删除</button> </template> <script setup lang='ts'> import type { Directi 阅读全文

摘要： <template> <lifeComponent v-demo="{color: 'red'}"></lifeComponent> </template> <script setup lang='ts'> import { ref, reactive } from 'vue' import typ 阅读全文

摘要： <template> <button @click="flag = !flag">改变model值</button> <div>{{ flag }}</div> <div>{{ text }}</div> // 可以定义多个v-model,语法是v-model:自定义变量 // 可以自定义修饰符 < 阅读全文

摘要： 1.功能介绍，自动帮你引入所需要使用的工具 2.安装npm i unplugin-auto-import -D 3.config文件配置 import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import v 阅读全文

摘要： <template> <Tsx name="jsx传值" @toEmit="getEmitValue"></Tsx> {{ msg }} </template> <script setup lang='ts'> import Tsx from './index.tsx' import { ref } 阅读全文

摘要： <template> <A></A> <B></B> </template> <script setup lang='ts'> import A from './A.vue' import B from './B.vue' // 兄弟组件之间的通信在Vue3中没有bus，通过插件mitt来完成兄弟之 阅读全文

摘要： <template> <div>爷爷{{ msg }}</div> <father /> <son /> </template> <script setup lang='ts'> import { ref, provide, readonly } from 'vue' import father f 阅读全文

摘要： <template> <div> <input v-model="num.current" type="number" step="20"/> <div>{{ num.tweenedNumber }}</div> </div> </template> <script setup lang='ts'> 阅读全文

摘要： <template> <button @click="random">随机</button> 通过move-class属性,设置元素移动时的动画效果 <transition-group tag="div" move-class="mm" class="warp"> <div v-for="item 阅读全文

摘要： <template> <div @click="add">add</div> <div @click="pop">pop</div> transition标签,可以对单个元素进行动画处理,并且只是对元素的添加和删除进行动画处理 transition-group标签,可以对多个元素进行动画处理,并且只 阅读全文