吴小明- - 博客园

2021年8月9日

摘要： 1、Live Server 实时编译html文件，很香的 2、Bracket Pair Colorizer 将括号的颜色区分开来，看着就很爽 3、Vetur 代码补全、语法高亮、格式化等 4、Vue VSCode Snippets 代码补全 5、Community Material Theme 更换阅读全文

posted @ 2021-08-09 20:12 吴小明- 阅读(244) 评论(0) 推荐(0) 编辑

$router.addRoutes()+vuex 动态添加路由

摘要： 1、store/index.js： import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export default new Vuex.Store({ state: { isLogin: false }, mutations: { 阅读全文

posted @ 2021-08-09 19:44 吴小明- 阅读(464) 评论(0) 推荐(0) 编辑

2021年8月8日

Vue.extend()

摘要：作用：将ui组件转为js组件利用Vue.extend()封装一个toast组件 1、components/MyToast/index.vue <template> <div class="container" v-if="show"> <div>{{ text }}</div> </div> </ 阅读全文

posted @ 2021-08-08 22:19 吴小明- 阅读(360) 评论(0) 推荐(0) 编辑

2021年8月6日

vue router滚动行为scrollBehavior

摘要： views/cityDetail.vue： <template> <div class="city-detail">{{$route.params.id}}</div> </template> <style> .city-detail{ height: 1500px; line-height: 50 阅读全文

posted @ 2021-08-06 22:08 吴小明- 阅读(402) 评论(0) 推荐(0) 编辑

vue路由精确匹配模式 exact

摘要：给当前路由加上active类名高亮显示： <template> <div id="app"> <router-link to='/' active-class="active">首页</router-link> | <router-link :to="{name:'about'}" active-c 阅读全文

posted @ 2021-08-06 21:08 吴小明- 阅读(2059) 评论(1) 推荐(1) 编辑

redirect和alias的区别

摘要： redirect和alias都是可以将一个地址匹配到想要去到的路由 redirect： { path: '/a', redirect: '/about' } 如果访问 /a 会跳转到 /about alias： { path: '/about', name: 'about', component: 阅读全文

posted @ 2021-08-06 20:30 吴小明- 阅读(188) 评论(0) 推荐(0) 编辑

vue命名路由（name）的作用

摘要：命名路由： { path: '/about', name: 'about', component: About } 作用： 1、路由跳转 this.$router.push({ name: 'about' }) 2、路由重定向 { path: '/a', redirect: { // path: ' 阅读全文

posted @ 2021-08-06 20:16 吴小明- 阅读(976) 评论(0) 推荐(0) 编辑

vue使用动态路由的注意事项

摘要：使用动态路由： views/Home.vue： <template> <div>Home</div> </template> views/User.js： <template> <div> 当前用户id：{{id}} </div> </template> <script> export defaul 阅读全文

posted @ 2021-08-06 19:35 吴小明- 阅读(154) 评论(0) 推荐(0) 编辑

vue父子组件的挂载顺序（mounted）

摘要： Father.vue： <script> import Child from './Child' export default { beforeCreate() { console.log('父组件 beforeCreate') }, created() { console.log('父组件 cre 阅读全文

posted @ 2021-08-06 19:01 吴小明- 阅读(1767) 评论(0) 推荐(2) 编辑

template和render的优先级？

摘要： <body> <div id="app"> <p>{{message}}</p> </div> <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.11/vue.js"></script> <script> new Vue({ el: '#a 阅读全文

posted @ 2021-08-06 17:28 吴小明- 阅读(119) 评论(0) 推荐(0) 编辑

吴小明

公告