随笔分类 - 网站相关 / Vue3基础知识
记录学习vue3的点点滴滴
摘要：1、npm install element-plus --save，安装UI 2、main.js代码如下： // import './assets/main.css' // 引入下面这两行 import ElementPlus from 'element-plus' import 'element-
阅读全文
摘要：1.App.vue代码如下： <template> <button @click="change">切换组件</button> <p></p> <keep-alive> <component :is="tabComponent"></component> </keep-alive> </templa
阅读全文
摘要：1、App.vue代码如下： <template> <button @click="change">切换组件</button> <p></p> <keep-alive> <component :is="tabComponent"></component> </keep-alive> </templa
阅读全文
摘要：1、App.vue代码如下： <template> <component :is="tabComponent"></component> <button @click="change">切换组件</button> </template> <script> import Child1 from "./
阅读全文
摘要：1、App.vue代码如下： <template> <div> <h3>主页面</h3> <button @click="change">改变</button> </div> </template> <script> export default { beforeCreate() { console
阅读全文
摘要：1、App.vue代码如下： <template> <div> <h3>主页面</h3> <Slot001> <template #s1="slotProps"> <h4>{{ msg }} {{ slotProps.msg1 }}</h4> </template> <template #s2="s
阅读全文
摘要：1、App.vue代码： <template> <div> <h3>主页面</h3> <Slot001 v-slot="slotProps"> <h4>{{ msg }} {{ slotProps.msg }}</h4> </Slot001> </div> </template> <script>
阅读全文
摘要：1、App.vue代码如下： <template> <div> <h3>插槽学习</h3> <Slot001> <!-- 插槽1--> <template v-slot:s2> <p>{{ msg1 }}</p> </template> <!-- 插槽2--> <template #s1> <p>{
阅读全文
摘要：1、App.vue代码如下： <template> <div> <h3>插槽学习</h3> <!-- 插槽1--> <Slot001> <p>{{ msg }}</p> </Slot001> <!-- 插槽2--> <Slot001> <!-- <p>{{ msg }}</p>--> </Slot0
阅读全文
摘要：1、App.vue代码如下： <template> <div> <h3>插槽学习</h3> <Slot001> <p>我是主页面</p> </Slot001> </div> </template> <script> import Slot001 from './view/Slot001.vue' e
阅读全文
摘要：1、App.vue代码如下： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码如下： <te
阅读全文
摘要：1、App.vue代码： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father代码如下： <template
阅读全文
摘要：1、App.vue代码： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码： <templa
阅读全文
摘要：1、App.vue代码: <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码： <templa
阅读全文
摘要：1、App.vue代码： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码： <templa
阅读全文
摘要：1、App.vue代码： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码 <templat
阅读全文
摘要：1、App.vue代码如下： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码如下： <te
阅读全文
摘要：1、App.vue代码如下： <template> <Father/> </template> <script setup> import Father from './view/Father.vue' </script> <style> </style> 2、Father.vue代码如下： <te
阅读全文
摘要：1、main.js代码如下： // import './assets/main.css' import {createApp} from 'vue' import App from './App.vue' import Config from "@/config.js"; import Testpa
阅读全文
摘要：1、一个经典的样式布局 2、App.vue代码如下： <template> <Header/> <Main/> <Aside/> </template> <script> import Aside from "./view/Aside.vue"; import Main from "./view/M
阅读全文
